JQuery Table Sorter on simple table

Question

I'm having some trouble with the JQuery table-sorter plugin.

My HTML structure is pretty simple, and I'm just calling the function on (trying both ALL tables and tables with .tablesorter class), but nothing seems to work. Not sure what is causing this.

My HTML:

<table width="300" border="1" cellspacing="0" cellpadding="2&quot;" class="tablesorting">
<thead>
<tr>
 <td style="text-align: center;" width="75"><strong>Utley</strong></td>
 <td style="text-align: center;" width="75"><strong>Age</strong></td>
 <td style="text-align: center;" width="75"><strong>Cano</strong></td>
</tr>
</thead>
<tbody>
<tr>
  <td style="text-align: center;" width="75">.376</td>
  <td style="text-align: center;" width="75">26</td>
  <td style="text-align: center;" width="75">.352</td>
</tr>
<tr>
 <td style="text-align: center;" width="75">.379</td>
 <td style="text-align: center;" width="75">27</td>
 <td style="text-align: center;" width="75">.381</td>
</tr>
<tr>
 <td style="text-align: center;" width="75">.410</td>
 <td style="text-align: center;" width="75">28</td>
 <td style="text-align: center;" width="75">.349</td>
</tr>
<tr>
 <td style="text-align: center;" width="75">.380</td>
 <td style="text-align: center;" width="75">29</td>
 <td style="text-align: center;" width="75">.379</td>
</tr>
</tbody>
</table>

And my JS:

$(document).ready(function() {
  $('.tablesorting').tablesorter({debug: true})
});

Not really sure what I'm missing. The documentation seems to say that this should be ample for it to work.

http://jsfiddle.net/mR5zt/

Answer 1

try using <th> instead of <td> in your <thead> section

beyond that I would check the obvious culprits, hit f12, check for errors, check to see if your paths to the plugin is correct, be sure you're loading jquery first if it requires it.