title: Table filtering using jQuery
body: <p>I'm trying to implement filtering of a table using jQuery. Here's the code I have for testing:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$("#txtGroup").keyup(function() {
    var value = this.value;
  
    $("table").find("tr").each(function(index) {
      if (index === 0) return;
      var id = $(this).find("td").find("label").text();
      $(this).toggle(id.indexOf(value) !== -1);
    });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;input id="txtGroup" /&gt;
  
  &lt;table id="tblGroups"&gt;
   &lt;tr&gt;&lt;td&gt;&lt;label&gt;&lt;input type="checkbox" id="AccountingFinance" name="Accounting &amp;amp; Finance"&gt;Accounting &amp;amp; Finance&lt;/label&gt;&lt;/td&gt;&lt;/tr&gt;
   &lt;tr&gt;&lt;td&gt;&lt;label&gt;&lt;input type="checkbox" id="AdvancedAnalytics" name="Advanced Analytics"&gt;Advanced Analytics&lt;/label&gt;&lt;/td&gt;&lt;/tr&gt;
   &lt;tr&gt;&lt;td&gt;&lt;label&gt;&lt;input type="checkbox" id="Alliances" name="Alliances"&gt;Alliances&lt;/label&gt;&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;&lt;label&gt;&lt;input type="checkbox" id="BusinessAdvisoryServices" name="Business Advisory Services"&gt;Business Advisory Services&lt;/label&gt;&lt;/td&gt;&lt;/tr&gt;
   &lt;tr&gt;&lt;td&gt;&lt;label&gt;&lt;input type="checkbox" id="BusinessApplicationsandIntegration" name="Business Applications and Integration"&gt;Business Applications and Integration&lt;/label&gt;&lt;/td&gt;&lt;/tr&gt;
   &lt;tr&gt;&lt;td&gt;&lt;label&gt;&lt;input type="checkbox" id="BusinessOperations" name="Business Operations"&gt;Business Operations&lt;/label&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Or here on <a href="https://jsfiddle.net/naszxvkg/" rel="nofollow noreferrer">jsFiddle</a></p>
  
  <p>I'm seeking:</p>
  
  <ul>
  <li>Type in a "b" and only the first row remains. The rows with a "b" disappear.</li>
  <li>Type in "ll" and "Alliances" remains (good), but also "Accounting &amp; Finance" remains.</li>
  <li>Type in "cc" and only "Accounting &amp; Finance" remains. Good.</li>
  </ul>
  
  <p>As you can see, the results are very hit and miss.</p>
  
  <p>By the way, I got this basic function from this question here on Stack Overflow:</p>
  
  <p><a href="https://stackoverflow.com/questions/12433304/live-search-through-table-rows">Live search through table rows</a></p>