Question

Confusing title, huh? I tried to explain it as best as i could.

What i mean is, if i have a menu like this:

<ul>
    <li> Home </li>
    <li class="current"> Portfolio </li>
    <li> Store </li>
    <li> About </li>
</ul>

and use the .next() method to get the next element FROM the current one:

$('ul li.current').next()

the result selector is:

ul li.current.next()

instead of a real selector. I mean, i can’t target ul li.current.next() with CSS (and therefore it isn’t a “real” selector). The real selector would look like ul li.

Is there any way to get the “real” selector of the next element?

Answer 1

If you want the equivalent CSS selector, it would be:

ul li.current + li

See: Adjacent sibling selector

Note: Not supported in IE6.

Also note that jQuery does not use CSS selectors to match all the elements. The selector syntax is just similar (it is a superset) to CSS because it seemed to be the most natural way. It uses methods provided by the browser (e.g. querySelectorAll) where it can but it also has to traverse the DOM in order to find the elements.

E.g. you can never match $('td').closest('tr') with CSS as you cannot “move up” with CSS.

I hope this answers your question, if not please clarify it.