JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<div class="table-responsive">
  <table class="table table-bordered table-striped table-condensed mb-none" id="tsTable">
    <thead>
				<tr>
					<th>Column 1</th>
					<th>Column 2</th>
					<th>Column 3</th>
				</tr>
			</thead>

  <tr>
    <td>Some value 1</td>
    <td>Some value 2</td>
    <td data-order="1234"}}> Some value 3</td>      
  </tr>  
</table>

<input type="button" value="click me" id="button">

JavaScript

$(document).ready(function() {
	table = $('#tsTable').DataTable();

});

$('#button').click(function(){
	table.row.add({"0": "New value 1", "1": "New value 2", "2": {display:"100", '@data-order': 1234}}).draw();
  table.draw();

})