Lets say I have something like this:

<tr>
<td><input type="text" /></td>
<td>Somevalue</td>
<td><intput type="text /></td>
</tr>

I am in the event handler for a keypress in the first text box. I want to find the next td which has a text box in it if it exists using jQuery.

Lets say I have something like this:

<tr>
<td><input type="text" /></td>
<td>Somevalue</td>
<td><intput type="text /></td>
</tr>

I am in the event handler for a keypress in the first text box. I want to find the next td which has a text box in it if it exists using jQuery.

• javascript
• jquery

3 Answers 3

Something like this should work (assuming this is the input).

var next = $(this).parent().next("td > input[type='text']");

tj111's answer does not work for me. May be that is because of newer version of jQuery. I came up with this:

var next = $(this).parent().nextAll().has("input[type='text']").first();

I don't know what is your selector, but if you need to select all inputs (type text). You can try this.

$(function(){ 

    $(':input').each(function(){
        $(this).keypress(function(){
          $(this).next('input[type=text]').val('I\'m the next');
     }) // end of keypress
    }) // enf of each
}) // End of function

So, do not matter where you put more inputs, you can always take them.