jQuery: select the last 4 items in the list [duplicate]

Question

I have a list of images/ text links,

<ul>
<li>link 1</li>
<li>link 2</li>
<li>link 3</li>
<li>link 4</li>

<li>link 5</li>
<li>link 6</li>
<li>link 7</li>
<li>link 8</li>
</ul>

and I style the list in my .css file,

li {
  float:left;
  margin:0px 5px 5px 0px; 
}

but then I want the last 4 items in the list to be displayed without the 5px space at their margin bottom. so I would like to use jQuery to select these last 4 item and change their css style to marginBottom:0px;

The problem is that this is how jQuery selects the last item:

li:last

but what about the last 4? or maybe the last 5, or 6?

Thanks.

Answer 1

$('li').slice(-4).css('color', 'red')

Example

Answer 2

var e = $('li').slice(-4).css('margin-bottom', '0px');    

Demo

Answer 3

use :gt() As in:

var n = $('ul').size();
var lastFour = $('li:gt(' + n-5 + ')');

http://api.jquery.com/gt-selector/

Answer 4

$('li').slice(-4).addClass('last-li-items');

Then in your css:

.last-li-items {
    margin-bottom:0 !important;
}