CODEWITHSUNDEEP
jqueryjquery-selectors
Emil Avramov
Emil Avramov

Reputation: 921

jQuery find next element with class

I have a quite simple question, that ate me 4 hours and is not yet solved: How to find next span with specific class with jQuery? I have the following html

<tr>
    <td align="right">Име:&nbsp;</td>
    <td align="left">
         <input type="text" value="<?=$profileSQL['user_name']; ?>" name="user_name" class="input required" />
    </td>
</tr>
<tr>
    <td align="right" colspan="2">
         <span class="error"></span>
    </td>
</tr>

and I validate it with jQuery. I want if there's an error message, generated with js (just a string), jQuery to find nearest span with class .error and to text() the message in there. I tried with nextAll(), next("span.error") and a lot of other things, but nothing helped me.

Thanks in advance!

Upvotes: 5

Views: 10974

Answers (4)

paladin
paladin

Reputation: 51

the problem is that .next() and .nextAll() only search through through the siblings (elements that have the same parent).

From jQuery documentation:

Description: Get all following siblings of each element in the set of matched elements, optionally filtered by a selector.

In your case you have:

  <tr> 
     <td> title here</td> 
     <td><input name="user_name"/> </td>
   </tr>
   <tr>
     <td colspan="2">
       <span class="error"></span>
     </td> 
   </tr>

As i understand your JQuery code is run on the input, right? In this case before calling newxt() or nextAll() you should first go up 2 levels, until the and afterwards select the next because there is the that you want to find, so:

here's a working example to check it: http://jsfiddle.net/EM5Gw/

Upvotes: 2

Groovetrain
Groovetrain

Reputation: 3325

I know this may not be exactly what you're looking for, but if you've GOT the input, like this:

var input = $('input[name="user_name"]');

Then you can just do:

input.parents('tr').eq(0).next().find('.error').text(nameErrEmptyMsg);

Upvotes: 2

JamesHalsall
JamesHalsall

Reputation: 13475

You can use the next('span.error'):

http://jsfiddle.net/wPZgg/

Upvotes: 0

xkeshav
xkeshav

Reputation: 54016

try 

  console.log($("td>span").next().find(".error").text())

Upvotes: 0

Related Questions