use of jquery data table in mvc

$(function () {
    getDataGridList();
 
});
function getDataGridList() {
    $('#baseDataTd').empty();
    var columns = 'PSASOfficeCode,PSASOfficeName,StateName,CityName,ContactNo';
    var baseDataTable = [];
    var i = 0;
    var check = "";
    $.getJSON('GetOffice', {}, function (data) {
        baseDataTable = $('<table id="baseDataTable" class="display" style="width: 100%;" ></table>');
        var row = $('<tr></tr>');
        //$(columns.split(',')).each(function () {
        //    row.append('<th>' + this + '</th>');
        //});
        row.append('<th>PSASOffice Code</th><th>PSASOffice Name</th><th>State Name</th><th>City Name</th><th>Contact No</th>');
        row.append('<th>Action</th>');
        baseDataTable.append($('<thead></thead>').append(row));
        $(data).each(function () {
            var cObj = this;
            row = $('<tr></tr>');
            $(columns.split(',')).each(function () {
                row.append('<td>' + cObj[this] + '</td>');
            });
            row.append('<td><img onclick=EditRecord(' + cObj["PSASOfficeCode"] + ') src="/Content/Images/Edit.png" style="cursor:pointer;" />&nbsp;<img onclick=DeleteRecord(' + cObj["PSASOfficeCode"] + ') src="/Content/Images/delete.gif" style="cursor:pointer;" /></td>');
            baseDataTable.append(row);
            i++;
        });
        $('#baseDataTd').empty().append(baseDataTable);
        baseDataTable.dataTable();
    });
}