Tablesorter demo

All options included, as well as the uitheme widget

by Mottie

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">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.dark.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.default.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.dropbox.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.green.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.grey.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.ice.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.black-ice.css">
<table class="tablesorter">
    <thead>
        <tr>
            <th>Rank</th>
            <th>Date</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>Jun 26, 2004 7:22 AM <span>more junk</span></td>
        </tr>
        <tr>
            <td>11</td>
            <td>Aug 21, 2009 12:21 PM <span>blah</span></td>
        </tr>
        <tr>
            <td>12</td>
            <td>Oct 13, 2000 1:15 PM</td>
        </tr>
        <tr>
            <td>111</td>
            <td>Jul 6, 2006 8:14 AM</td>
        </tr>
        <tr>
            <td>21</td>
            <td>Dec 10, 2002 5:14 AM <span>Hello kitty</span></td>
        </tr>
        <tr>
            <td>013</td>
            <td>Jan 12, 2003 11:14 AM</td>
        </tr>
        <tr>
            <td>005</td>
            <td>Jan 18, 2021 9:12 AM <span>hello</span></td>
        </tr>
        <tr>
            <td>10</td>
            <td>Jan 8, 2012 5:11 PM</td>
        </tr>
        <tr>
            <td>16</td>
            <td>Jan 14, 2004 11:23 AM</td>
        </tr>
        <tr>
            <td>166</td>
   ...

JavaScript

$('table').tablesorter({
    theme: 'blackice',
    textExtraction: {
        1: function (node) {
            return node.childNodes[0].nodeType === 3 ? node.childNodes[0].nodeValue : $(node).text();
        }
    },
    widgets: ['zebra', 'columns']
});