How do I choose the last 2 items in a list with css nth-child?

Question

Is it possible? If not, is there a way to do it with jQuery?

Answer 1

It is possible with CSS3. Consider the markup:

    
First item
    
Second item
    
Test
    
Test
    
Pre-last item
    
Last item

To choose the last two LI elements you do:

ul > li:nth-last-of-type(-n+2) {
    background: green;
}

Works in all contemporary browsers including IE9, but excluding IE8 and below. To add support for those browsers, you might consider using Selectivizr.js