JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://autobahn.tablesorter.com/jquery.tablesorter.min.js"></script>
<link rel="stylesheet" href="http://tablesorter.com/docs/css/jq.css">
<link rel="stylesheet" href="http://tablesorter.com/themes/blue/style.css">
<table id="myTable" class="tablesorter" >
<thead>
<tr>
<th>Last Name</th>
<th>First Name</th>
<th>Email</th>
<th>Due</th>
<th>Web Site</th>
</tr>
</thead>
<tbody>
<tr>
<td>Smith</td>
<td>John</td>
<td>[email protected]</td>
<td>$50.00</td>
<td>http://www.jsmith.com</td>
</tr>
<tr>
<td>Bach</td>
<td>Frank</td>
<td>[email protected]</td>
<td>$50.00</td>
<td>http://www.frank.com</td>
</tr>
<tr>
<td>Doe</td>
<td>Jason</td>
<td>[email protected]</td>
<td>$100.00</td>
<td>http://www.jdoe.com</td>
</tr>
<tr>
<td>Conway</td>
<td>Tim</td>
<td>[email protected]</td>
<td>$50.00</td>
<td>http://www.timconway.com</td>
</tr>
</tbody>
</table>
JavaScript
$(document).ready(function() {
// call the tablesorter plugin
$("table").tablesorter({
// set forced sort on the fourth column and i decending order.
$("#myTable").tablesorter( {sortList: [[0,0], [1,0]]} );
});
});