Why is This jQuery Statement Working?

[chaseman]

On my blog: http://www.webprofitideas.com

 

I'm using the jQuery plugin Superfish, and I simply needed a way to select ALL the navi items WITHOUT a sub menu (which slides down).

 

This is how the navigation is laid down:

 

<div id="navi">
<div id="blog_navi">
<ul class="sf-menu">
<li><a>main item 1</a></li>
<li><a>main item 2</a></li>
<li><a>main tiem 3</a> <ul class="children"><li><a>sub-item-1</a></li><li><a>sub-item-2</a></li></ul></li> /* li tag + sub menu here */
<li>main item 4</li>
</ul>
</div>
</div>

 

 

And now I want to select all the li main items in the navi BUT the ones with a sub menu. Logically thinking you'd think that this is the right syntax to do so:

 

jQuery('.sf-menu li:not(:contains(ul))').addClass('noSub');

 

But for some reason this won't work and it will select ALL li tags even the ones containing a ul tag.

 

This on the other hand will give the desired effect:

 

jQuery('.sf-menu li:not(:contains(a))').addClass('noSub');

 

For some reason this will select all the main items without a sub menu EVEN THOUGH every single navigation item CONTAINS an anchor tag.

 

I'm really confused on this one and can simply not understand why this works.

 

If every navi item contains an anchor tag then it should simply select none of them.

 

Any ideas, why this works?

[chaseman]

I figured that contains is used for searching text, what I actually need is :not(:has(ul)), and now it works as expected.