$.getJSON between a .foreach() loop

here is my code:

    $('#sub_program_details').empty();

                     data.parent_sub_programs.forEach(function (element) {
                         var a = 0;
                        // console.log(element);
                         existing_sub_program.forEach(function (existing) {
                             if(element.parent_program_id == existing.admitted_sub_program){
                                 a = 1;
                             }
                         });
                         var HTML="";

                         HTML+='<tbody>';

                         HTML+='<tr>';
                         HTML+='<th>';
                         if(a==1){
                           HTML+='<input type=checkbox class="parent" id="'+element.parent_program_id+'" name="sub_program_checking[]" value="'+element.parent_program_id+' '+element.parent_program_fee+'" checked disabled>  '+element.parent_program_name+'';
                         }
                         else{
                             HTML+='<input type=checkbox class="parent" id="'+element.parent_program_id+'" name="sub_program_checking[]" value="'+element.parent_program_id+' '+element.parent_program_fee+'">  '+element.parent_program_name+'';
                         }
                         HTML+='</th>';
                         HTML+='</tr>';
                         //HTML+='</tbody>';
                        // console.log(HTML);
                         console.log('parent');
                         // $('#sub_program_details').append(HTML);
                          console.log('after');
                         $.getJSON('ChildSubProgramSelectionForCompanyProgramYear?company_program_id=' +company_program_id+ '&year=' +year+'&parent_program_id='+element.parent_program_id,function (child) {
                             console.log('before');
                             console.log(child);
                             // var HTML="";
                             //
                             // HTML+='<tbody>';
                             child.child_sub_programs.forEach(function (e) {

                                 console.log(e);
                                 var b = 0;
                                 existing_sub_program.forEach(function (existing) {
                                     if(e.sub_program_id == existing.admitted_sub_program){
                                         b = 1;
                                     }
                                 });
                                 HTML+='<tr>';
                                 HTML+='<td>';
                                 if( b==1){
                                     HTML+='<input type=checkbox id="'+e.sub_program_id+'" name="sub_program_checking[]" class="'+element.parent_program_id+'" value="'+e.sub_program_id+' '+e.sub_program_fee+'" checked disabled>  '+e.sub_program_name+'';
                                 }
                                 else{
                                     if($("#"+element.parent_program_id).prop("disabled")){
                                         console.log('yes');
                                         HTML+='<input type=checkbox id="'+e.sub_program_id+'" name="sub_program_checking[]" class="'+element.parent_program_id+'" value="'+e.sub_program_id+' '+e.sub_program_fee+'" >  '+e.sub_program_name+'';

                                     }
                                     else{
                                         HTML+='<input type=checkbox id="'+e.sub_program_id+'" name="sub_program_checking[]" class="'+element.parent_program_id+'" value="'+e.sub_program_id+' '+e.sub_program_fee+'" disabled>  '+e.sub_program_name+'';

                                     }
                                 }
                                 HTML+='</td>';
                                 HTML+='</tr>';
                             });
                             HTML+='</tbody>';
                            // console.log('child');
                             $('#sub_program_details').append(HTML);
                         });

                     });

I want to print : parent after before parent after before (as there is two parent_program).

but it prints: parent after parent after before before;

Why? and what could be the solution?