Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery find next element with class

I'm trying to find the next element with a class of "error" and hitting a wall.

In looking at the demo on jQuery's site, this should work, but doesn't.

$("button[disabled]").next().text("this button is disabled");  <div>    <button disabled="disabled">First</button>    <span>no overwrite</span>    <span class="error"></span> </div>  <div>    <button>Second</button>    <span></span> </div>  <div>    <button disabled="disabled">Third</button>    <span>no overwrite</span>    <span class="error"></span> </div> 

I'm trying to find the span or div or whatever after the element in question, like the button above.

so the disabled button line should read, 'no overwrite this button is diabled'

I've tried

$("button[disabled]").next(".error").text("this button is disabled");

to no avail.

like image 763
Loony2nz Avatar asked Nov 25 '09 00:11

Loony2nz


People also ask

How to find the next element in jQuery?

jQuery next() Method The next() method returns the next sibling element of the selected element. Sibling elements are elements that share the same parent. The DOM tree: This method traverse forward along the next sibling of DOM elements.

How to find next element id in jQuery?

You can use the first() method in jquery to fetch the first element in the collection as well which seems like a faster option. var nextSectionWithId = $(this). closest("section"). nextAll("section[id]").

What is closest in jQuery?

The closest() method returns the first ancestor of the selected element. An ancestor is a parent, grandparent, great-grandparent, and so on. The DOM tree: This method traverse upwards from the current element, all the way up to the document's root element (<html>), to find the first ancestor of DOM elements.


1 Answers

The problem is that your using the next traversing function rather than nextAll

$("button[disabled]").nextAll(".error").text("this button is disabled"); 

When you use next its just looking at the "next" element which is

<span>no overwrite</span> 

Next all looks at all siblings that are next

like image 173
PetersenDidIt Avatar answered Sep 20 '22 15:09

PetersenDidIt