Create 5 Dynamic tables on page load

See more:

table

hi
Below is the code I use to build an HTML table on the fly (using JSON data received from the server).

At first, I was just happy to make this happen (display the table), I guess now I need to work on efficiency. I want to know how to go to a static "Loading" display.

Suggestions for --> efficiency? Possibly a better way to build the table? Or maybe not a table, but some other "table" like display

function SelEmployee() {

    $.ajax({
        type: 'POST',
        url: 'AppHome.aspx/Select',
        contentType: 'application/json',
        data: "{}",
        dataType: 'json',
        processData: false,

        success: function (response) {
            OnSuccessUserEnrolledEvents(response);
        },
        error: function (xhr, ajaxOptions, thrownError) {
            OnErrorUserEnrolledEvents(xhr.status, thrownError);
        }
    });
    return true;
}

function OnErrorUserEnrolledEvents(status, error) {

    alert("Some information cann't be loaded, sorry for inconvenience");
}

function OnSuccessUserEnrolledEvents(result) {

    if (result.d == '') {
        var eventlist = "<div>Sorry! You have not enrolled for any event</div>";
        document.getElementById("Msg").InnerHTML = eventlist;
        //return true;
    }
    else {
        Sel = eval('(' + result.d + ')');
        if (Sel.length == 0) {
            eventlist = "<div>Sorry! You have not enrolled for any event</div>";
            document.getElementById("Msg").InnerHTML = eventlist;
        }
        else {
            var table = document.getElementById("dataTable");
//            var row = table.insertRow(rowCount);
            var colCount = table.rows[0].cells.length;
            for (var i = 0; i < Sel.length; i++) {
                var rowCount = table.rows.length;
                var row = table.insertRow(rowCount);
                var Bit = (Sel[i].Bit_Value).toString();
                var Emp_Id = (Sel[i].Employee_Id).toString();
                var Emp_Name = (Sel[i].Employee_Name).toString();
                for (var j = 0; j < colCount; j++) {

                    var newcell = row.insertCell(j);
                    newcell.innerHTML = table.rows[i].cells[j].innerHTML;
                    switch (newcell.childNodes[0].id) {
                        case "Idtext": newcell.childNodes[0].innerHTML = Emp_Id;
                            break;
                        case "BitCheck":
                            {
                                if (Bit == "false") {
                                    newcell.childNodes[0].checked = false;
                                }
                                else {
                                    newcell.childNodes[0].checked = true;
                                }
                            }
                            break;
                        case "Nametext": newcell.childNodes[0].innerHTML = Emp_Name;
                            break;
                    }
                }
            }
        }
    }
}