как найти селектор :last в каждом третьем уровне ДОМа?

[Round]

есть вложенность элементов в ДОМе:

<div>

    <a href="#">
        <span>Beer</span>
        <span class="amp">&nbsp;&amp;&nbsp;</span>
    </a>
    <a href="#">
        <span>Fresh</span>
        <span class="amp">&nbsp;&amp;&nbsp;</span>
    </a>

</div>
    
    <br />
    
<div>

    <a href="#">
        <span>Blue</span>
        <span class="amp">&nbsp;&amp;&nbsp;</span>
    </a>
    <a href="#">
        <span>Water</span>
        <span class="amp">&nbsp;&amp;&nbsp;</span>
    </a>  

</div>

в песочнице

$("div span.amp:last").hide();

В итоге прячется самый последний .amp в ДОМе.

А я хочу спрятать каждый последний .amp в каждом диве. Как это можно сделать?

[BETEPAH]

$("div").find("span.amp:last").hide();

[Round]

BETEPAH, точно... и логично.

Спасибо!

[devote]

$("div").find("span.amp:last").hide();

не рекомендую использовать нестандартные псевдо-селекторы, так как ради них, джуквери запускает собственный поиск элементов, что приводит к понижению производительности.

Лучше пишите максимально если возможно стандартные псевдо-селекторы:

$("div").find("span.amp:last-child").hide();

таким образом, браузер не выдаст ошибку при обработки такого селектора, и джуквери не запустит свой внутренний движок поиска.

try {
    document.querySelectorAll('span.amp:last');
    alert('Используется нативный метод');
} catch(_e_) {
    alert('Запустился jQuery движок');
}

try {
    document.querySelectorAll('span.amp:last-child');
    alert('Используется нативный метод');
} catch(_e_) {
    alert('Запустился jQuery движок');
}

[Round]

$("div").find("span.amp:last-child").hide();

Но так не работает...

или я что то упускаю?

[devote]

Но так не работает...

ну вообще конечно есть отличия от стандартного псевдо-класса.. last-child возвращает последние элементы у родителя, а :last возвращает последний элемент в списке.. Это единственная разница. Для вашего случая все же придется юзать просто :last увы