title: Hiding all but first table row with jQuery
body: <p>I have a table with a drop-down html selector in the first row. The first option is blank.</p>
  
  <p>I need to hide all rows in the table except the ones that match selector value. If the first option is selected -- hide all rows below. The reason i used class for TRs, because there could be multiple rows for some matched options.</p>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$("#mySelector").change(function(){
      opt = $(this).val();
      if(opt != "") {
          $("." + opt).show();
      } else {
          $("#myTbl tr:not(first-child)").hide(); 
      }
  });
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;table id="myTbl"&gt;
  &lt;tr&gt;
     &lt;td&gt;
      &lt;select id="mySelector"&gt;
      &lt;option&gt; select one
      &lt;option value="val1"&gt; v1
      &lt;option value="val2"&gt; v12
      &lt;option value="val3"&gt; v3
      &lt;/selector&gt;
     &lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr class="val1"&gt;
     &lt;td&gt;
      asdasd 1
     &lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;tr class="val2"&gt;
     &lt;td&gt;
      asdasd 2
     &lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;tr class="val3"&gt;
     &lt;td&gt;
      asdasd 3
     &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>It seems like it should work, but it doesn't. What am I missing?</p>