Animate Background Position on Each Click
<p>I'm developing a photography portfolio theme and I've hit a bit of a snag while writing the jQuery for a feature on the site. What I'm trying to accomplish is to get it so that every single time I click the previous and next icons an inline list of thumbnails moves left or right 110px (the width of a single thumbnail).</p>

<pre><code>$('.next').each(
    function(){
        $(this).bind (
            "click",
            function(event){
                $('#thumbnailGallery ul').animate(
                    {left:-110}, {
                        duration:'fast',
                        easing:'easeInSine'
                });
            }
        );
    }
);

$('.prev').each(
    function(){
        $(this).bind (
            "click",
            function(event){
                $('#thumbnailGallery ul').animate(
                    {left:110}, {
                        duration:'fast',
                        easing:'easeInSine'
                });
            }
        );
    }
);
</code></pre>

<p>I'm currently using the .each(); function to bind the animation using onClick but the animation only occurs once. For example if I click .next it will animate -110px but when I click it again it won't. The same occurs for .prev.</p>
