jquery displaying table rows dynamically in dom belonging to one/more particular class
- by whatf
I have the basic html structure:
<table>
<tbody>
<tr class="1">
<td>
<p style="font-size:large">
<span class="muted"> This is the first object </span>
</p>
</td>
</tr>
<tr class="2">
<td>
<p style="font-size:large">
<span class="muted"> This is second object </span>
</p>
</td>
</tr>
<tr class="3">
<p style="font-size:large">
<span class="muted"> this is the third object </span>
</p>
</td>
</tr>
</tbody>
</table>
and then I have check boxes, the functionality i want is,
if checkbox 1 is checked, only the tr with class 1 be displayed.
if checkbox 2 and 3 are clicked, the tr with class 1 gets hidden and 2, 3 show in the dom.
again if checkbox 2,*3* are unchecked and 1 is checked tr with class 2, 3 do not show and 1 is showed.
How can this be done in jQuery?
