JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<script src="//cdn.datatables.net/plug-ins/1.10.7/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/1.10.7/integration/bootstrap/3/dataTables.bootstrap.css">
<script src="//cdn.datatables.net/tabletools/2.2.4/js/dataTables.tableTools.min.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/tabletools/2.2.4/css/dataTables.tableTools.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<div class="table-wrapper">
    <table id="locTable" class="table table-striped table-bordered center dTables">
        <thead>
            <tr>
                <th>Partner</th>
                <th>Connectivity</th>
                <th>Location ID</th>
            </tr>
        </thead>
        <tbody></tbody>
    </table>
</div>

JavaScript

$(document).ready(function() {
    iniLocTable(locTable);
});	
function iniLocTable(tableId) {
	var table = $(tableId).DataTable( { // dataTable is old school, use table.api().* to use newer DataTable api
		// Settings
		"ajax": myData,
		"sAjaxDataProp": "dcgReport",
		"columns": [
		   {'data': 'locName'},
		   {'data': 'adapterName'},
		   {'data': 'locId'}]
	} );
}

var myData = {"dcgReport":{"adapterName":"N/A","divDesc":"N/A","divId":"N/A","locId":"N/A","locName":"N/A","propId":"N/A","propName":"N/A"}};