Superscrollorama - How can I animate multiple list items?

Question

I have a list of items (blog posts) that I would like to fade and slide in from the side, when scrolled to. However, I cannot work out how to do this without explicitly selecting each item.

Using a class simply animate's them all at the same time, but I would like it to fire its action on each individual post only when it needs to.

var controller = $.superscrollorama();

controller.addTween('.post', TweenMax.from( $('.post'), .5, { css: {opacity: 0, right:'1000px'} }));

The thing is, I cannot simply hard-code all items, as the page is dynamic and I don't know how many there would be.

Is there a way to loop through items with an each statement, to achieve this effect?

Thanks for your time.

Answer 1

Ok, I figured it out. It's as simple as using an each() function, like so:

$(".post").each(function() {

    $this = $(this);
    controller.addTween( $this, TweenMax.from( $this, .5, { css: {opacity: 0, right:'1000px'} }));

});