JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/plug-ins/1.10.12/sorting/natural.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css">
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
  <thead>
    <tr>
      <th>Qty 1</th>
      <th>Qty 2</th>
    </tr>
  </thead>
</table>

JavaScript

$(document).ready(function () {
    var tableDataSet = [
    	{ 
    	"first_value" : "1200",
      "second_value" : "2000",
      "unit" : "U"
      },
			{ 
    	"first_value" : "800",
      "second_value" : "3200",
      "unit" : "Tn"
      },
			{ 
    	"first_value" : "500",
      "second_value" : "1400",
      "unit" : "U"
      }];

			$('#example').dataTable({
      	"data": tableDataSet,
				"columns": [
            { "data": "first_value", "type": "natural",
				render: $.fn.dataTable.render.number('.', ',', 0)
        	},
            { "data": "second_value", "type": "natural",
				render: $.fn.dataTable.render.number('.', ',', 0)
        	}
				],
	    "paging":   false,
	    "info":     false,
	    "searching":false,
    });
 });