Question

Quick js\jquery question.

I have a table like this:

<table id="test">
<tr class="divider"><td>Set 1</td></tr>
<tr><td>Row 1</td></tr>
<tr><td>Row 2</td></tr>
<tr><td>Row 3</td></tr>
<tr class="divider"><td>Set 2</td></tr>
<tr><td>Row 4</td></tr>
<tr><td>Row 5</td></tr>
<tr><td>Row 6</td></tr>
<tr class="divider"><td>Set 3</td></tr>
<tr><td>Row 7</td></tr>
<tr><td>Row 8</td></tr>
<tr><td>Row 9</td></tr>
</table>

I want to select only the 3 rows between the rows with the class “divider”.

I started a jsfiddle here: http://jsfiddle.net/ZQhBP/1/

I am using nextUntil but it doesn’t seem to be working right

Thanks for any help.

Answer 1

nextUntil() definitely works:

var pull = $('.divider:first').nextUntil('.divider');
console.log(pull);

JS Fiddle demo.

And to move those rows and insert to a new table element, after the first:

var pull = $('.divider:first').nextUntil('.divider');
console.log(pull);

$('<table />').insertAfter('table:first').append('<tbody />').html(pull);

JS Fiddle demo.

And, if you’d rather copy/clone to a new table:

var pull = $('.divider:first').nextUntil('.divider');
console.log(pull);

$('<table />').insertAfter('table:first').append('<tbody />').html(pull.clone(true,true));

JS Fiddle demo.

References:

• append().
• clone().
• :first selector.
• html().
• insertAfter().
• nextUntil().