JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css">
<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>
<table id="tab_open_deals" class="table">
    <thead>
        <tr>
            <th>A</th>
            <th>B</th>
            <th>C</th>
        </tr>
    </thead>
    <tbody id="search_result">
        <tr>
            <td>AAA 0%</td>
            <td>39.90</td>
            <td>29 Dec 2012</td>
        </tr>
        <tr>
            <td>AAA 20%</td>
            <td>1499.00</td>
            <td>8 Jan 2013</td>
        </tr>
        <tr class="test">
            <td>AAA 10%</td>
            <td>1002.00</td>
            <td>3 Jan 2013</td>
        </tr>
    </tbody>
</table>

JavaScript

$(function () {
    $("#tab_open_deals").tablesorter({
        theme: "bootstrap",
        headerTemplate: '{content} {icon}',
        widgets: ["uitheme"]
    });
});