Set the deepest nested ul / ol element with css

Question

In a nested list like the one below, how would one target ul containing joe without knowing the actual depth in advance?

 <ul> <li>foo <ul> <li>bar <ul> <li>baz <ul> <li>joe</li> </ul> </li> </ul> </li> </ul> </li> </ul> 

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

Answer 1

As far as I know, this is not possible since there is currently no parent selector in CSS , but you can use the jQuery $('ul:not(:has(ul))'); selector $('ul:not(:has(ul))'); for target ul without any child ul and add a class to them.

Example

Answer 2

var str = $ ("ul> li: last"). text (); alert ("The deepest value: -" + str);