JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="//cdn.datatables.net/1.10.3/css/jquery.dataTables.min.css">
<script src="//cdn.datatables.net/1.10.3/js/jquery.dataTables.min.js"></script>
<table id="test_sort">
<thead>
<tr>
<th>Month</th>
<th>Totals</th>
</tr>
</thead>
<tbody>
<tr>
<td><span style="display:none;">01</span>January</td>
<td>1,081</td>
</tr>
<tr>
<td><span style="display:none;">02</span>February</td>
<td>1,271</td>
</tr>
<tr>
<td><span style="display:none;">03</span>March</td>
<td>1,288</td>
</tr>
<tr>
<td><span style="display:none;">04</span>April</td>
<td>1,305</td>
</tr>
<tr>
<td><span style="display:none;">05</span>May</td>
<td>1,316</td>
</tr>
<tr>
<td><span style="display:none;">06</span>June</td>
<td>612</td>
</tr>
<tr>
<td><span style="display:none;">07</span>July</td>
<td>697</td>
</tr>
<tr>
<td><span style="display:none;">08</span>August</td>
<td>732</td>
</tr>
<tr>
<td><span style="display:none;">09</span>September</td>
<td>799</td>
</tr>
<tr>
<td><span style="display:none;">10</span>October</td>
<td>818 <span class="a"><span class="b">(current)</span></span></td>
</tr>
<tr>
<td><span style="display:none;">11</span>November</td>
<td>837</td>
</tr>
<tr>
<td><span style="display:none;">12</span>December</td>
<td>899</td>
</tr>
</tbody>
</table>
CSS
#test_sort {
margin: 0;
width: 80%;
}
.a {
position: absolute;
}
.b {
margin-left: 10px;
}
th {
text-align: left;
}
.right, th.right {
text-align: right;
}
JavaScript
$('#test_sort').dataTable({
columnDefs: [
{targets: 1, className: 'right'}
],
paging: false,
searching: false,
info: false
});