JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://live.datatables.net/media/css/demo_page.css">
<link rel="stylesheet" href="http://live.datatables.net/media/css/demo_table.css">
<script src="http://datatables.net/download/build/jquery.dataTables.nightly.js"></script>
<script src="http://www.datatables.net/download/build/ColReorder.nightly.js"></script>
<script src="msf.markit.com/portal/scripts/jquery.format-1.2.min.js"></script>
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table>

<button type="button" id="btnChangeData">Change Data</button>

JavaScript

var dataSet1 = [];
var dsRow1 = [];
dsRow1.push(new Date());
dsRow1.push("1000000");
dataSet1.push(dsRow1);
var dsRow2 = [];
dsRow2.push(new Date());
dsRow2.push("2000000");
dataSet1.push(dsRow2);
var dsRow3 = [];
dsRow3.push(new Date());
dsRow3.push("3000000");
dataSet1.push(dsRow3);
var dsRow4 = [];
dsRow4.push(new Date());
dsRow4.push("4000000");
dataSet1.push(dsRow4);
var dsRow5 = [];
dsRow5.push(new Date());
dsRow5.push("5000000");
dataSet1.push(dsRow5);

var dataSet2 = [];
var dsRow1 = [];
dsRow1.push(new Date());
dsRow1.push("6000000");
dataSet2.push(dsRow1);
var dsRow2 = [];
dsRow2.push(new Date());
dsRow2.push("7000000");
dataSet2.push(dsRow2);
var dsRow3 = [];
dsRow3.push(new Date());
dsRow3.push("8000000");
dataSet2.push(dsRow3);
var dsRow4 = [];
dsRow4.push(new Date());
dsRow4.push("9000000");
dataSet2.push(dsRow4);
var dsRow5 = [];
dsRow5.push(new Date());
dsRow5.push("10000000");
dataSet2.push(dsRow5);

var dataSet = dataSet1;

var columnDefs = [
    { "aTargets": ["_all"], "asSorting": ["desc", "asc"] },
    { "aTargets": [0], "sTitle": "Start Date", "sType": "date", "fnRender": getDisplayDate, "bUseRendered": false },
    { "aTargets": [1], "sTitle": "Quantity", "sType": "numeric", "bUseRendered": false }
];

var oTable = $("#example").dataTable({
    "sDom": 'Rlfrtip',
    "aoColumnDefs": columnDefs,
    "aaData": dataSet,
    "bPaginate": false,
    "bInfo": false,
    "bFilter": false,
    "bAutoWidth": true,
    "bJQueryUI": true,
    "bLengthChange": false,
    "aaSorting": [[0, "asc"]]
});

function getDisplayDate(oObj) {    
    var sValue = oObj.aData[oObj.iDataColumn];        
    if (sValue == null) return "";
    if (sValue.getMonth)
    {            
        return $.format.date(sValue, 'dd-MMM-yy');
    }
    else   
    {
        return "Bad date";
    }
}

$("#btnChangeData").click(function(e)
                          {
                              if(dataSet == dataSet1)
                              {
                           ...