Tablesorter demo
All options included, as well as the uitheme widget
HTML
<script src="http://mottie.github.com/tablesorter/js/jquery.tablesorter.js"></script>
<script src="http://mottie.github.com/tablesorter/js/jquery.tablesorter.widgets.js"></script>
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.blue.css">
<script src="//mottie.github.com/tablesorter/js/widgets/widget-math.js"></script>
<table class="tablesorter">
<thead>
<tr>
<th>AlphaNumeric</th>
<th>Numeric</th>
<th>Animals</th>
<th>Sites</th>
</tr>
</thead>
<tfoot>
<tr>
<th>AlphaNumeric</th>
<th data-math="col-sum">Numeric</th>
<th>Animals</th>
<th>Sites</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>abc 123</td>
<td data-number="10">Ten</td>
<td>Koala</td>
<td>http://www.google.com</td>
</tr>
<tr>
<td>abc 1</td>
<td data-number="20">Twenty</td>
<td>Ox</td>
<td>http://www.yahoo.com</td>
</tr>
<tr>
<td>abc 9</td>
<td data-number="5">Five</td>
<td>Girafee</td>
<td>http://www.facebook.com</td>
</tr>
<tr>
<td>zyx 24</td>
<td data-number="30">Thirty</td>
<td>Bison</td>
<td>http://www.whitehouse.gov/</td>
</tr>
<tr>
<td>abc 11</td>
<td data-number="2">Two</td>
<td>Chimp</td>
<td>http://www.ucla.edu/</td>
</tr>
<tr>
<td>abc 2</td>
<td data-number="3">Three</td>
<td>Elephant</td>
<td>http://www.wikipedia.org/</td>
</tr>
<tr>
<td>abc 9</td>
<td data-number="10">Ten</td>
<td>Lion</td>
<td>http://www.nytimes.com/</td>
</tr>
<tr>
<td>ABC 10</td>
<td...
JavaScript
$(function () {
$('table').tablesorter({
theme: 'blue',
textAttribute: 'data-number',
widgets: ['zebra', 'math']
});
});