title: jQuery: Wrap elements with nextUntil()
body: <pre><code>&lt;h2 id="match" class="contentHeadline"&gt;Match only in here&lt;/h2&gt;
  
  &lt;p&gt;I don't if or how many dl+table live here.&lt;/p&gt;
  
  &lt;dl&gt;&lt;dt&gt;Text&lt;/dt&gt;&lt;/dl&gt;
  &lt;table class="groupTable"&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;Abc&lt;/td&gt;&lt;/table&gt;
  
  &lt;dl&gt;&lt;dt&gt;Text&lt;/dt&gt;&lt;/dl&gt;
  &lt;table class="groupTable"&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;Def&lt;/td&gt;&lt;/table&gt;
  
  &lt;dl&gt;&lt;dt&gt;Text&lt;/dt&gt;&lt;/dl&gt;
  &lt;table class="groupTable"&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;Ghi&lt;/td&gt;&lt;/table&gt;
  
  &lt;p class="foo"&gt;Maybe some text lives here. I should not float.&lt;/p&gt;
  </code></pre>
  
  <p>I want to wrap each pair of dl + table in a div.box (floating), but only directly under h2#match until other stuff following (.foo or headlines).</p>
  
  <pre><code>$("dl").each(function(){
      $(this).next('.groupTable').andSelf()
          .wrapAll('&lt;div class="box"&gt;&lt;/div&gt;');
  });
  
  /* Clear */
  $('&lt;div class="clear"&gt;&lt;/div&gt;').after('.box:last');
  </code></pre>
  
  <p><code>nextUntil()</code> wraps dl and the table individually.</p>
  
  <p>Atm the test group is wrongly wrapped.</p>
  
  <p>Test: <a href="http://jsfiddle.net/GQwB5/" rel="nofollow">http://jsfiddle.net/GQwB5/</a></p>
  
  <p>Desired result: <a href="http://jsfiddle.net/kppQ9/" rel="nofollow">http://jsfiddle.net/kppQ9/</a></p>