DataTables

DataTables Examples

HTML

<link rel="stylesheet" href="//cdn.datatables.net/1.10.0/css/jquery.dataTables.css">
<script src="https://cdn.datatables.net/1.10.7/js/jquery.dataTables.js"></script>
<table id="example">
    <thead>
        <tr>
            <th>Employee</th>
        </tr>
    </thead>
    <tbody>
       <tr><td class="employee_identity"><span></span></td></tr>
       <tr><td class="employee_identity"><span></span></td></tr>
       <tr><td class="employee_identity"><span></span></td></tr>
       <tr><td class="employee_identity"><span></span></td></tr>
       <tr><td class="employee_identity"><span></span></td></tr>
    </tbody>
</table>

JavaScript

const employees = [ 
	{ val: "Tiger Nixon", order: "NixonTiger" },
  { val: "Garrett Winters", order: "WintersGarrett" },
  { val: "Ashton Cox", order: "CoxAshton" },
  { val: "Cedric Kelly", order: "KellyCedric" },
  { val: "Adrien Kelly", order: "KellyAdrien" }
];

let table = $('#example').DataTable();

$('.employee_identity').each(function(index, node) {
	$(node).attr('data-order', employees[index].order);
  $(node).append(employees[index].val);
});

table.cells('.employee_identity').invalidate('dom').draw();