Использование JQuery для выбора элементов списка, которые * не * содержат ссылку

Question

Попытка добавить цвет фона для всех элементов моей ул, которые не содержат ссылку

HTML:

<ul id="list"> 
    <li><a href="http://google.com/">Google</a></li> 
    <li><a href="http://yahoo.com/">Yahoo</a></li> 
    <li>Not a link</li> 
    <li><a href="http://live.com/">Live</a></li> 
    <li>Not a link</li> 
    </ul> 

Javascript:

$('#list li').css({'background': 'red'}); 

Но это меняет все из них - http://jsbin.com/pusogihuvi/1/edit?html,js,output

Answer 1

Используйте :not псевдоселектор для исключения совпадений. Используйте псевдоселектор :has, чтобы увидеть, содержит ли элемент заданное соответствие (без потери области предка).

$('#list li:not(:has(a))').css({'background': 'red'}); 

Answer 2

Вы можете комбинировать :not и :has:

$('#list > li:not(:has(a))').css({'background': 'red'}); 

http://jsbin.com/quyalunipo/1/edit?html,css,js,output