JQuery nextUntil table traversal selection

Question

Imagine I have following table:

<table>
<tr>
<td id="1">1</td>
<td id="2">2</td>
<td id="3">3</td>
</tr>

<tr>
<td id="4">4</td>
<td id="5">5</td>
<td id="6">6</td>
</tr>
</table>

I need to able to select the range. Each table cell has unique ID. So I use

$("#"+first).nextUntil("#"+last)

, where first and last are just some arbitrary IDs.

It works totally OK, if selected cells are located in the same row. Problem occures when they are located in two different rows. What it does - it selects all the cells from the "first" row and that's it.

It is not moving forward past "</tr><tr>" point, if I understand it properly.

I've tried using:

$("#"+first).nextUntil("#"+last).filter('tr')

But no luck. Is there a way to move forward ? Is there any solution ?

Answer 1

Yes, nextUntil only traverses siblings.

Something like this should work:

$('table td').filter(function(){
    return parseInt(this.id) => first && parseInt(this.id) <= last;
});

Or just use the index of the tds. This way you don't need the IDs:

$('table td').filter(function(index){
    return index => first && index <= last;
});