Select All Elements That Are Not A Descendant Of A Specified Element

Using a jQuery selector, is it possible to select all elements that are not a descendant of the elements from another selector. For example, I would like to select all the a tags t

Solution 1:

Assuming you are looking for descendants (since having a a element as a sibling to th elements is not valid HTML) you can use the :not pseudo-selector to do this:

$('a:not(th a)');

This should be pretty fast in modern browsers using document.querySelectorAll, but might be slower than the original for older versions of IE.

See a simple demo here: http://jsfiddle.net/JR5sP/

Solution 2:

Assuming that you do want to do as your question asks (regardless of the invalid HTML fact) and filter out elements with a specific sibling,

You can do this:

$('a').filter(function() {
    return $(this).siblings('b').length == 0;
}).css('color', 'orange');

HTML:

<div><b>Hello there</b><a>Don't select me!</a></div><div><a>Select me!</a><a>Select me too!</a></div>

See http://jsfiddle.net/JR5sP/1/