Question

We have a simple ul

<ul>
   <li>some text</li>
   <li>some some text</li>
   <li>text more</li>
   <li>text here</li>
</ul>

ul { text-align: center; width: 100px; }
li { width: auto; display: inline; }

So the ul can have several lines. How do I take last li of the each line inside ul?

Answer 1

If by last li on the each line of the ul you mean the last li in each ul, then:

$('ul li:last-child');

However, if you mean that you have your li‘s within the same ul written up on several lines in your source code, and you now want to get the last one on each line, then the answer is that you can’t. The DOM does not care about your newline characters in your code.

---

Note: the correct way to do this would be to give those li‘s a separate class.

<ul>
    <li></li><li></li><li class="last"></li>
    <li></li><li></li><li class="last"></li>
    <li></li><li></li><li class="last"></li>
</ul>

Now you can use CSS

li.last { color: #444 }

and jQuery

$('li.last');

the proper way…