Question

How can I hide a row of the table(MyTable) by an id when I check checkbox(MyCheckbox) and show the row when the checkbox(MyCheckbox) is unchecked using Jquery?

Answer 1

$(":checkbox").click(function(){
    var index = $("#myCheckboxes :checkbox").index($(this));
    $("#myTable tr").eq(index).toggle();
});

<table id="myTable">
    <tr><td>Row 1</td></tr>
    <tr><td>Row 2</td></tr>
    <tr><td>Row 3</td></tr>
    <tr><td>Row 4</td></tr>
</table>

<table id="myCheckboxes">
    <tr><td><input type="checkbox" /> checkbox 1</td></tr>
    <tr><td><input type="checkbox" /> checkbox 2</td></tr>
    <tr><td><input type="checkbox" /> checkbox 3</td></tr>
    <tr><td><input type="checkbox" /> checkbox 4</td></tr>
</table>

Online example:

http://jsfiddle.net/VdqNt/3/