Question

I am trying to select <li> in groups of 3, currently I am using :gt and :lt like this

 $('.events_list li:lt(7):gt(3)').css('display', 'block');

This is ok but seems like there may be a better way. I just want to click a button and select the next 3 <li>.

Answer 1

Try

var triplet = 0;

$('button').click(function(){
    $('.events_list li')
        .hide() // hide the ones that are visible
        .filter(function(i){
            return i >= triplet*3 && i < (triplet+1)*3; // filter the next 3
        })
        .show(); // and show them

    triplet++;
});

demo at http://jsfiddle.net/PyEhU/