Jquery target span after current element

Question

I want to find the next instance of an element at the same level.

<div id="foo"></div>
<some html />
<span></span>

<div id="foo2"></div>
<span></span>

What jQuery selector would allow me to target the next span for foo and then foo2. I took a look into next, siblings and closest, but I couldn't get anything to work.

Answer 1

Use .nextAll() together with the :first selector:

$('#foo').nextAll('span:first')

Alternatively, use the next siblings selector ~ (known in CSS3 as the general sibling selector) together with the :first selector:

$('#foo2 ~ span:first')

Preview both on jsFiddle