Get Last Li On A Line Jquery

Question

We have a simple ul

some text
some some text
text more
text here

Solution 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><liclass="last"></li><li></li><li></li><liclass="last"></li><li></li><li></li><liclass="last"></li></ul>

Now you can use CSS

li.last { color: #444 }

and jQuery

$('li.last');

the proper way...

Solution 2:

see jquery .last()

$('ul li').last().css('background-color', 'red');

Solution 3:

This returns group of "last li on the each line of the ul"

$("ul li:last");

Solution 4:

To get the last item in the list using jQuery you can simply use the last() method.

See here for more information : http://api.jquery.com/last/

var item = $('#myList li').last()

Solution 5:

Use the :last selector - http://api.jquery.com/last-selector/

$("ul li:last");

and if you're trying to find the last li for multiple ul's try this:

var $lasts = $("ul").map(function(){
    return $(this).find("li:last");
});

working example:

http://jsfiddle.net/hunter/SBsqS/

Html5 Guru