42

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.

Jonas
  • 121,568
  • 97
  • 310
  • 388
Loony2nz
  • 4,691
  • 6
  • 28
  • 31
  • 1
    when you say it doesn't work, do you mean that the text says "this button is disabled" when it should actually say "no overwrite this button is disabled"? – Robert Harvey Nov 25 '09 at 00:40
  • @Robert: Sorry for the confusion. What i mean is that to the right of the disabled button, there should be text, "this button is diabled". not the actual button text. – Loony2nz Nov 25 '09 at 00:48

3 Answers3

72

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

random_user_name
  • 25,694
  • 7
  • 76
  • 115
PetersenDidIt
  • 25,562
  • 3
  • 67
  • 72
  • 11
    If you have several .error elements, you will need .nextAll(".error").first(). A bit counter-intuitive, but .next() is only for the physically next item, no chance to make conditions. – Sprachprofi Apr 12 '12 at 09:19
  • 2
    No idea why can't next = nextAll("").first(). And why the currently description for next be called "nextElement()". This is why naming functions that explains itself is extremely important in coding! I cant even fathom how many people get corrected by this.. – sksallaj Sep 07 '12 at 20:07
  • In other words: `.nextAll()` filters first by selector, _then_ looks for the truly next one(s) within that set. — `.next` looks first for the next one(s), then filters that set down. The latter might i.e. be useful to handle _sometimes_-trailing `
    `s or such...     – Frank N Feb 28 '17 at 10:03
4

Try this:

$("button[disabled=disabled]").parent().find("span.error").text("this button is disabled");

hope it helps. Sinan.

Sinan
  • 11,443
  • 7
  • 37
  • 48
  • @Sinan: nope. Nothing happens. $("button[disabled=disabled]").parent().find("span.error").text("this button is disabled");
    - no overwrite
    -
    - no overwrite
    plug that into your browser and see if it works for you. The disabled buttons with span class='error' should be updated.     – Loony2nz Nov 25 '09 at 00:51
0

next() won't work in this case because it has to be a sibling for that to work. In this case you need:

$("button[disabled]").parent().nextAll()
  .find("span.error:first").text("this button is disabled");
cletus
  • 616,129
  • 168
  • 910
  • 942