JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.2/css/jquery.dataTables.css">
<div id="div_container" style="display:none;">
<table id="tbl_datatable1">
<thead></thead>
<tbody></tbody>
<tfoot></tfoot>
</table>
</div>
<br/>
<br/>
<table id="tbl_datatable2">
<thead></thead>
<tbody></tbody>
<tfoot></tfoot>
</table>
JavaScript
$(document).ready(function() {
$('#tbl_datatable1')
.dataTable( {
'scrollX': true,
'bInfo': false,
'bFilter': false,
'bPaginate': false,
'aoColumns': [
{"sTitle":"ID","mData":"ID","bUseRendered":false,"sDefaultContent":null,"sClass":""},
{"sTitle":"Name","mData":"Name","bUseRendered":false,"sDefaultContent":null,"sClass":""},
{"sTitle":"Description","mData":"Description","bUseRendered":false,"sDefaultContent":null,"sClass":""},
{"sTitle":"Flaginfo","mData":"Flaginfo","bUseRendered":false,"sDefaultContent":null,"sClass":""},
],
}
);
$('#tbl_datatable2')
.dataTable( {
'scrollX': true,
'bInfo': false,
'bFilter': false,
'bPaginate': false,
'aoColumns': [
{"sTitle":"ID","mData":"ID","bUseRendered":false,"sDefaultContent":null,"sClass":""},
{"sTitle":"Name","mData":"Name","bUseRendered":false,"sDefaultContent":null,"sClass":""},
{"sTitle":"Description","mData":"Description","bUseRendered":false,"sDefaultContent":null,"sClass":""},
{"sTitle":"Flaginfo","mData":"Flaginfo","bUseRendered":false,"sDefaultContent":null,"sClass":""},
],
}
);
$('#div_container').show();
} );