hide some table row according to multiple checkbox selection with jquery
<p>Hi I have 2 tables like this with some checkbox for filter the table:</p>

<pre><code>&lt;label&gt;&lt;input type="checkbox" name="chk_filter_Grocery_1" id="chk_filter_Grocery_1_1" value="1;"&gt;Alamond&lt;/label&gt;
&lt;label&gt;&lt;input type="checkbox" name="chk_filter_Grocery_1" id="chk_filter_Grocery_1_2" value="14;"&gt;Apple&lt;/label&gt;
&lt;label&gt;&lt;input type="checkbox" name="chk_filter_Grocery_1" id="chk_filter_Grocery_1_3" value="5;6;"&gt;Lemon &amp; Orange&lt;/label&gt;
&lt;label&gt;&lt;input type="checkbox" name="chk_filter_Grocery_1" id="chk_filter_Grocery_1_4" value="17;"&gt;Coconut&lt;/label&gt;

&lt;table width="620px" id="Grocery-NA768"&gt;
    &lt;tbody&gt;
        &lt;tr class="14"&gt;
            &lt;td width="185" height="35" align="left"&gt;Apple&lt;/td&gt;
            &lt;td width="65" height="35" align="center" valign="middle"&gt;3 Kg&lt;/td&gt;
            &lt;td width="80" height="35" align="center" valign="middle"&gt;28/07/2011&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="5"&gt;
            &lt;td height="35" align="left"&gt;Lemon&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;5 Kg&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;28/07/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="17"&gt;
            &lt;td height="35" align="left"&gt;Coconut&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;4 Kg&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;28/07/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="14"&gt;
            &lt;td height="35" align="left"&gt;Apple&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;2 Kg&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;27/04/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="1"&gt;
            &lt;td height="35" align="left"&gt;Almond&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;3 Kg&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;27/04/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="6"&gt;
            &lt;td height="35" align="left"&gt;Orange&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;3 kg&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;27/04/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
    &lt;/tbody&gt;
&lt;/table&gt;

&lt;label&gt;&lt;input type="checkbox" name="chk_filter_Wine_1" id="chk_filter_Wine_1_1" value="51;"&gt;Brunello di Montalcino&lt;/label&gt;
&lt;label&gt;&lt;input type="checkbox" name="chk_filter_Wine_1" id="chk_filter_Wine_1_2" value="4;"&gt;Dolcetto&lt;/label&gt;
&lt;label&gt;&lt;input type="checkbox" name="chk_filter_Wine_1" id="chk_filter_Wine_1_3" value="35;64;"&gt;Pinot noir &amp; Pinot blanc&lt;/label&gt;
&lt;label&gt;&lt;input type="checkbox" name="chk_filter_Wine_1" id="chk_filter_Wine_1_4" value="72;"&gt;Shiraz &lt;/label&gt;
&lt;table width="620px" id="Wine-NA768"&gt;
    &lt;tbody&gt;
        &lt;tr class="4"&gt;
            &lt;td width="185" height="35" align="left"&gt;Dolcetto&lt;/td&gt;
            &lt;td width="65" height="35" align="center" valign="middle"&gt;3 b&lt;/td&gt;
            &lt;td width="80" height="35" align="center" valign="middle"&gt;28/07/2011&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="35"&gt;
            &lt;td height="35" align="left"&gt;Pinot blanc&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;5 b.&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;28/07/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="72"&gt;
            &lt;td height="35" align="left"&gt;Shiraz&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;4 b.&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;28/07/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="14"&gt;
            &lt;td height="35" align="left"&gt;Dolcetto&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;2 b.&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;27/04/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="51"&gt;
            &lt;td height="35" align="left"&gt;Brunello di Montalcino&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;3 b.&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;27/04/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr class="64"&gt;
            &lt;td height="35" align="left"&gt;Pinot noir&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;3 b.&lt;/td&gt;
            &lt;td height="35" align="center" valign="middle"&gt;27/04/2011&amp;nbsp;&lt;/td&gt;
        &lt;/tr&gt;
    &lt;/tbody&gt;
&lt;/table&gt;
</code></pre>

<p>The two table have a different id (Grocery-NA768) and (Wine-NA768) and each checkbox has one or more (max 2) value (1;12;) and every  of the table has the corresponding number as class.</p>

<p>I would like to filter the table clicking on the checkbox. I.e. when I click the apple checkbox (value 14) I want to see only the apple in the table (class 14), then if I click on the citrus (value 1;12;) checkbox I will see apple (class 14), lemon (class 5)and orange. If I deselect all the checkbox I will see the whole list.
Same thing for the wine table. I site new of jquery and I've found how to show or hide table row clicking on a checkbox but nothing similar to my needs.</p>

<p>Thanks in advance
Michele</p>
