Greetings.

I can not make the right selector to select hidden items.

Here is an example: http://jsfiddle.net/8Uyn8/

I want to split up so that each time it is triggered it shows one element in each section.

I will be glad to any ideas, and links =)

Thank you very much in advance!

    2 answers 2

    Here you can pervert for a long time, but since you made the elements a separate style that hides them, why not delete this style in turn? See the result here

    var i = 0, but = $('#showNext'), sect = $('section'); but.click(function(){ sect.each(function(){ $(this).children('.item').eq(i).removeClass('hidden-item'); }); i++; });
    • Why make separate variables for #showNext and section if they are called only in one place each? - Crasher
    • 3
      @Crasher, A matter of habit ... besides, not the worst. - Deonis
    • @Deonis, but this is completely inappropriate here and it can negatively affect the understanding of the algorithm by the question author - Crasher
    • one
      @Crasher, somehow not in the mood for holivarit. - Deonis
    • @Crasher, section is called with each click aha. - zb '

    The answer is similar to the Deonis answer, but using the selector on children and :not(:visible):

    Js:

     $('#showNext').click(showOneElementInEachSection); var sect=$('section'); function showOneElementInEachSection() { sect.each(function () { $(this).children('.hidden-item:not(:visible)').first().fadeIn(100); }); }

    demo

    the second option is to remove the class:

     $('#showNext').click(showOneElementInEachSection); var sect=$('section'); function showOneElementInEachSection() { sect.each(function () { $(this).children('.hidden-item').first().removeClass('hidden-item'); }); }

    demo