当我们选择列div时，如何动态地在数据表中添加表列？

Question

我的表格代码......

 var table = $('#'+initId).DataTable({
   "scrollCollapse": true,
   "scrollX": true,
   "scrollY": "260px",
   "responsive":true
 }); 

我的JSON渲染代码......

$.ajax({
            url: requestURL,

    method: 'GET',
        data: {
            format: 'json'
        },
       dataType: 'json',
        success: function(data) {
var html='';
if(data.status == "IDT-200") {
    html+= '<table id="idt-table" class="display idt-scrollbar table table-bordered" cellspacing="0" width="100%"><thead>';
    html+= '<tr><th>Resource Name</th><th>Is Trusted</th><th>Type</th><th>Host Name</th><th>DB Name/DNS Name</th><th>DB Type</th><th>No of Users</th><th>No of Roles/Group</th></tr></thead><tbody>';
    for (var i=0;i<data.records.length;i++) {
        html+='<tr id="'+data.records[i]["rscid"]+'"><td class="res-name-'+data.records[i]["rscid"]+'">'+data.records[i]["rscname"]+'</td>';
        html+='<td>'+data.records[i]["trustedflag"]+'</td>';
        html+='<td>'+data.records[i]["rsctype"]+'</td>';
        html+='<td>'+data.records[i]["hostname"]+'</td>';
        html+='<td>'+data.records[i]["dbname"]+'</td>';
        html+='<td>'+data.records[i]["dbtype"]+'</td>';
        html+='<td>'+data.records[i]["noofuser"]+'</td>';
        html+='<td>'+ data.records[i]["noofrole"]+'</td></tr>';
    }
    html+= "</tbody></table>";
    //console.log(table_data);
    $("#idt-list-resources").html(html);

} else {
      html+='<tr class="text-center"><td>No Records In the Table</td>';
      $("#idt-list-resources").html(html);
}
        }
});