title: add class to first and last element in jquery
body: <p>I would like to add a class to the first and last '.sub' between the two '.heading' class with jQuery.</p>
  
  <pre><code>    &lt;table&gt;
          &lt;tr class="heading"&gt;&lt;/tr&gt;
          &lt;tr class="sub top-box"&gt;&lt;/tr&gt;
          &lt;tr class="sub"&gt;&lt;/tr&gt;
          &lt;tr class="sub bottom-box"&gt;&lt;/tr&gt;
          &lt;tr class="heading"&gt;&lt;/tr&gt;
          &lt;tr class="sub top-box"&gt;&lt;/tr&gt;
          &lt;tr class="sub"&gt;&lt;/tr&gt;
          &lt;tr class="sub"&gt;&lt;/tr&gt;
          &lt;tr class="sub"&gt;&lt;/tr&gt;
          &lt;tr class="sub bottom-box"&gt;&lt;/tr&gt;
      &lt;/table&gt;
  </code></pre>
  
  <p>I try this, but that's don't work :</p>
  
  <pre><code>    jQuery('.heading').click(function(e) {
          e.preventDefault();
  
          jQuery('.sub:first').nextUntil('.heading').toggleClass('top-box');
          jQuery('.sub:last').nextUntil('.heading').toggleClass('bottom-box');
      });
  </code></pre>