Question

I am trying to add a countdown timer (using this one http://keith-wood.name/countdown.html) to a td based on the text of another td within the same table using jQuery.

For example my table looks like this below and I want to add the timer to the time_remaining td if the status td contains the text “Received”.

<table>
    <tr>
        <td class="status">Completed</td>
       <td class="time_received"></td>
       <td class="time_remaining"></td>
    </tr>
    <tr>
        <td class="status">Received</td>
        <td class="time_received"></td>
        <td class="time_remaining"></td>
    </tr>        
</table>

And my jQuery currently looks like this below, but I’m using $(this).next() which will only add the timer to the time_received td, but I need to add it to the time_remaining td, what can I use instead of .next()? Any help would be appreciated.

 var newCount = new Date(); 
 newCount.setMinutes(newCount.getMinutes() + 30);
 $('td.status:contains(Received)').each(function() {
   $(this).next().countdown({
        until: newCount, 
        format: 'M',
        layout: "{mn} min"
        });
​});​

Answer 1

You can pass a selector to next and use an index to specify which – in your case there is just one sibling with the time_remaining class, so it’s the same

.next(".time_remaining")[0]

Alternatively, if you always want the second sibling you could do

.nextAll()[1]