Q:

My JavaScript/AJAX function only works while debugging

I am not very familiar with JavaScript and AJAX.  
I am developing a webpage that displays information return by a §.getJSON / JQuery request.  But this function only works, when I start debugging.  I know that the debugger corrects the timing and scope from other post on this topic.  But I cannot find my mistake.  I do not realy need a long explaination, because as I said before I am not very familiar with JavaScript/AJAX.  This is the script-part in the page (you can ignore the addDropDown() and the departmentSelected() functions(as far as i know)):
<script type="text/javascript">
var isSelected = [];

$(addDropDown);

function addDropDown(){
    $.getJSON("./api/persence/departments/all", function(data, status){
        if(status ! == "success"){
            alert(status);
        }else{
            var dropdownHead = "<button class='btn btn-primary dropdown-toggle' type='button' data-toggle='dropdown'>Abteilungen<span class='caret'><\/span><\/button>";
            var dropdownBody = "<ul class='dropdown-menu'>";
                            var i;
            for(i = 0; i < data.length; i++){
                dropdownBody = dropdownBody + "<li><a href='javascript:departmentSelected(" + i + "," + data[i].departmentId + ");'>";
                dropdownBody = dropdownBody + data[i].departmentName;
                dropdownBody = dropdownBody + " - ";
                dropdownBody = dropdownBody + data[i].departmentCity;
                dropdownBody = dropdownBody + "<\/a><\/li>";
            }
            dropdownBody = dropdownBody + "<\/ul>";
            dropdownHead = dropdownHead + dropdownBody;
            $("#dropdown-list").append(dropdownHead);
                            isSelected.length = i + 1;
        }

    });
    }

    function departmentSelected(position, value){
        if((isSelected[position] ! == value)){
            isSelected[position] = value;
        }else{
            isSelected[position] = "false";
        }
        loadTable();
    }

    function loadTable(){
        var tHead = "<br><div class='table-responsive'><table class='table'><thead><tr><th>#</th><th>Name<\/th><th>Beruf<\/th><th>Anwesend<\/th><th>Arbeitsplatz<\/th><\/tr><\/thead>";
        var tBody = "<tbody>";
        for(var i = 0; i < isSelected.length; i++){
                        var counter = 0;
            if(isSelected[i] ! == "false"){
                $.getJSON("./api/persence/departments/" + isSelected[i]).then(function(result, status){
                    if(status ! == "success"){
                        alert(status);
                    }else{

                        for(var i = 0; i < result.length; i++) {
                            var employee = result[i];
                            tBody = tBody + "<tr> <td>" + counter + "<\/td>";
                            tBody = tBody + "<td>" + employee.academicTitle + " " + employee.lastName + " " + employee.firstName + "<\/td>";
                            tBody = tBody + "<td>" + employee.job + "<\/td>";
                            tBody = tBody + "<td>";
                            if(employee.persenceStatus === "Y"){
                                tBody = tBody + employee.persenceSince;
                            }else{
                                                             //   if(employee.absenceReason ! == null){
                                tBody = tBody + employee.absenceReason;
                                                               // }
                                                                //else{
                                                                  //  tBody = tBody + " ";
                                                                //}
                            }
                            tBody = tBody + "<\/td>";
                            tBody = tBody + "<td>" + employee.workplace + "<\/td>";
                                                            tBody = tBody + "<\/tr>";
                                                            counter++;
                        }
                    }
                });
            }
        }
        tBody = tBody + "<\/tbody> <\/table> <\/div>";
        tHead = tHead + tBody;
        document.getElementById("outputTable").innerHTML = tHead;
        }

My Problem: I can not find what I have done wrong in this scriptpart, because the debugger (firebug) is able to optimize the code while debugging so it works perfectly fine.  But if I am not in debug-mode, only the "head-line" of the table is displayed (the information is missing). 
Thanks for your help. 

A:

Ok, I solved the problem myself: I had to put the following part into the function called by the jQuery request (function(result, status).....)

tBody = tBody + "</tbody> </table> </div>";
          tHead = tHead + tBody;
          document.getElementById("outputTable").innerHTML = tHead;

