JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.7/css/jquery.dataTables.css">
<table id="tab1" class='data tab01'>
	<thead>
		<tr>
			<th>cat1</th>
			<th>cat2</th>
			<th>cat3</th>
		</tr>
	</thead>
	<tbody>
	</tbody>
</table>

JavaScript

var t = $("#tab1").DataTable({
			"ajax": "https://api.myjson.com/bins/48g56",
			"aaSorting": [1],
			"columns": [
				{ "data": "cat2"},
				{ "data": "cat1"},
				{ "data": "cat3"}
				]
				});
					
			$.ajax({
				type: "GET",
				url: "https://api.myjson.com/bins/1bfa2",
				contentType: "application/json; charset=utf-8",
				dataType: "json",
				success: function (response) {
					t.rows.add(response.data); 
					t.draw();
				}
			  });