Question

I am using the latest and greatest jQuery.

I will have a ten divs with content. On page load, I need to close all divs except the first and second. Only the first two divs I want visible.

Under those visible two divs are “show more” and “show less” buttons. When the user clicks the show more button, all divs will slide down. When the user clicks the show less button, all but the first two divs should slide up.

I know how to get at the first, the last, but I don’t know how to filter out the first and the second element. I know I could get this done with more tinkering than I have already done, but I want to know the most efficient and readable way of getting it done. Can you help me?

One page load, this should go through and close all but the first and second divs:

$(".BrandParagraph").each(function() {
    // should close all but first and second
    $(this).slideUp;
});

 $(".ShowMore").click(function() {
     // slide down all
     $(".BrandParagraph").slideDown();
 });

 $(".ShowMore").click(function() {
     // slide up all but first and second
     $(".BrandParagraph").slideDown();
 });

Answer 1

You can use gt(n) to select elements greater than the index n:

$(".myDivs:gt(1)")