jquery - jQuery：用 nextUntil() 包装元素

Question

<h2 id="match" class="contentHeadline">Match only in here</h2>

<p>I don't if or how many dl+table live here.</p>

<dl><dt>Text</dt></dl>
<table class="groupTable"><td>1</td><td>Abc</td></table>

<dl><dt>Text</dt></dl>
<table class="groupTable"><td>2</td><td>Def</td></table>

<dl><dt>Text</dt></dl>
<table class="groupTable"><td>3</td><td>Ghi</td></table>

<p class="foo">Maybe some text lives here. I should not float.</p>

我想将每对 dl + table 包装在一个 div.box （浮动）中，但只能直接在 h2#match 下，直到后面有其他东西（.foo 或标题）。

$("dl").each(function(){
    $(this).next('.groupTable').andSelf()
        .wrapAll('<div class="box"></div>');
});

/* Clear */
$('<div class="clear"></div>').after('.box:last');

nextUntil()单独包装 dl 和表格。

Atm 测试组被错误地包装。

测试：http: //jsfiddle.net/GQwB5/

期望的结果：http: //jsfiddle.net/kppQ9/

Answer 1

$('#match').nextUntil('.contentHeadline')效果很好。

应用：

$('#match').nextUntil('.contentHeadline').filter('dl').each(function(){
    $(this).next('.groupTable').andSelf().wrapAll('<div class="box" />');
});
$('#match').nextUntil('.contentHeadline').filter('.box:last').after('<div class="clear" />');

小提琴：http: //jsfiddle.net/GQwB5/1/

我怀疑这.nextUntil(".foo, .contentHeadline")行不通，因为它需要一个匹配的元素，并且至少会返回两个。