Using jQuery how to select the first next element(s) that matches a certain selector?

Question

How to select a node after $(this) that matches a certain selector?

eg:

<textarea id="foo"></textarea>
<a href="#">someLink</a>
<a href="#">someOtherLink</a>
<textarea id="bar"></textarea>

With out directly selecting #bar via $("#bar"), how can i select it from within #foo?

Answer 1

Use the nextAll() method:

$("#foo").nextAll("textarea").first();

Or:

$("#foo").nextAll("textarea:first");

Or even:

$("#foo").nextAll("textarea:eq(0)");

Answer 2

Check out siblings()

$('#foo').siblings('textarea:first').addClass('found');

jsbin demo here