Last of specific selector

[u/KeinZantezuken]

I have a dynamic DOM tree with various element count:

[parent]:
.child_class_special
.child_class_entry
.child_class_entry
.child_class_entry
.child_class_pre_special
.child_class_special
.child_class_entry
.child_class_entry

What I want is to target last possible " .child_class_special", however, as I said, the number of child elements in parent is varying, there could be 3 " .child_class_special", or could be 7.

This:
.parent .child_class_special:not(:has(~ .child_class_special))

works but it is uggo. Any ideas for more concise selector?

[u/Weekly_Ferret_meal]

firstly, uggo?

Secondly you might have an html problem if these are your elements, are these divs? or some other elements?

but yeah, in this scenario this seems the only solution.

however, support isn't global. FF isn't fully supporting :has :

:has(~ .foo) won't work, but :has(> .foo) will. So you might need a JS fall back solution.