SO jQuery Fiddle

Test Fiddle mainly for SO Questions jQuery 1.4.3, UI 1.8.5

by Dipak1991

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/ui-lightness/jquery-ui.css">
<form>
    <table cellspacing="0" cellpadding="0" class="tablesorter" id="table">
        <thead>
            <tr>
                <th valign="middle" align="left" class="filebox">
                    <input type="checkbox" id="checkall" name="checkall">
                </th>
                <th valign="middle" align="left" class="header filename"><strong>Filename</strong>
                </th>
                <th valign="middle" align="left" class="header filesize"><strong>Size</strong>
                </th>
                <th valign="middle" align="left" class="header filedate"><strong>Date</strong>
                </th>
            </tr>
        </thead>
        <tbody class="file">
            <tr>
                <td valign="middle" align="left" class="filebox">
                    <input type="checkbox" class="checkbox" name="checkbox">
                </td>
                <td valign="middle" align="left" class="filename">Search48.png</td>
                <td valign="middle" align="left" class="filesize">6 KB</td>
                <td valign="middle" align="left" class="filedate">21/10/2010</td>
            </tr>
            <tr>
                <td valign="middle" align="left" class="filebox">
                    <input type="checkbox" class="checkbox" name="checkbox">
                </td>
                <td valign="middle" align="left" class="filename">shopping_trolley48.png</td>
                <td valign="middle" align="left" class="filesize">3 KB</td>
                <td valign="middle" align="left" class="filedate">21/10/2010</td>
            </tr>
        </tbody>
    </table>
</form>

CSS

.highlight {
    background-color: #ffeeee;
}

JavaScript

$("#checkall").change(function () {
    $(this).closest("table").find(".checkbox").attr("checked", this.checked).change();
});

$(".checkbox").change(function () {
    $(this).closest('tr').toggleClass("highlight", this.checked);
});