JQuery - find the next element that has a specific child element

Question

Let's say I have something like this:

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

I am in an event handler for pressing a key in the first text box. I want to find the next td that has a text field if it exists using jQuery.

Answer 1

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

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

Answer 2

Answer to

tj111 does not work for me. Perhaps this is due to a newer version of jQuery. I came up with this:

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

Answer 3

I do not know what your selector is, but if you need to select all the inputs (enter the 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, no matter where you invest more resources, you can always take them.