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 + в 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() Заворачивает дл и стол индивидуально.

Атм тестовая группа неправильно упакована.

Тест: 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") не будет работать, потому что он ожидает один соответствующий элемент, и это вернет как минимум два.