title: JQuery: search and filter a table by a single column
body: <p>I want to search a table by the values in a single column.</p>
  
  <p>The table looks like this:</p>
  
  <pre><code>  &lt;table class="table main-content"&gt;
  &lt;thead&gt;
    &lt;td&gt;&lt;b&gt;Title&lt;/b&gt;&lt;/td&gt;
    &lt;td&gt;&lt;b&gt;Name&lt;/b&gt;&lt;/td&gt;
    &lt;td&gt;&lt;b&gt;State (D)&lt;/b&gt;&lt;/td&gt;
    &lt;td&gt;&lt;b&gt;Party&lt;/b&gt;&lt;/td&gt;
    &lt;td&gt;&lt;b&gt;Room&lt;/b&gt;&lt;/td&gt;
    &lt;td&gt;&lt;b&gt;Phone #&lt;/b&gt;&lt;/td&gt;
    &lt;td&gt;&lt;b&gt;Special Role(s)&lt;/b&gt;&lt;/td&gt;
  &lt;/thead&gt;
  &lt;tbody id="congress"&gt;
  
    &lt;tr&gt;
      &lt;td&gt;Senator&lt;/td&gt;
      &lt;td&gt;&lt;a href="http://www.alexander.senate.gov/"&gt;Alexander, Lamar&lt;/a&gt;&lt;/td&gt;
      &lt;td&gt;TN&lt;/td&gt;        
      &lt;td class="republican"&gt;Rep.&lt;/td&gt;
      &lt;td&gt;455 Dirksen&lt;/td&gt;
      &lt;td&gt;(202) 224-4944&lt;/td&gt;
      &lt;td&gt;&lt;/td&gt;
    &lt;/tr&gt;
  
    &lt;tr&gt;
      &lt;td&gt;Senator&lt;/td&gt;
      &lt;td&gt;&lt;a href="http://www.barrasso.senate.gov"&gt;Barrasso, John&lt;/a&gt;&lt;/td&gt;
      &lt;td&gt;WY&lt;/td&gt;        
      &lt;td class="republican"&gt;Rep.&lt;/td&gt;
      &lt;td&gt;307 Dirksen&lt;/td&gt;
      &lt;td&gt;(202) 224-6441&lt;/td&gt;
      &lt;td&gt;&lt;/td&gt;
    &lt;/tr&gt;
    ...
  </code></pre>
  
  <p>I want to be able to search the table by a given column, say names (index 1) or state (index 2). I've tried <a href="http://jets.js.org" rel="nofollow noreferrer">jets.js</a> but it only allows one instance per page while I require at least two. JQuery is preferred, JS is fine, and external libs are ok but not optimal.</p>
  
  <p>Cheers!</p>
  
  <p>Edit:</p>
  
  <p>I've tried using the following:</p>
  
  <pre><code>var $rows = $('#congress tr');
  
          $('#stateSearch').keyup(function() {
  
              var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();
  
              $rows.show().filter(function() {
                  var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
                  return !~text.indexOf(val);
              }).hide();
  
  
          });
  </code></pre>
  
  <p>The above code searches all of the columns in the table. How can I adjust it to search only for a specific column? (By index.)</p>
  
  <p>The goal is to hide all of the tr that don't match the query in the given column</p>