jQuery Fade - Breaking after second iteration thru
<p>I have a small issue with a fade animation I'm assembling.<br>
It's functioning correctly twice thru the animation, and includes one wrap that works correctly.  </p>

<p>On the second wrap, it snaps to the first photo, not fade to.<br>
I've looked a bit at delays, but with it working correctly the first time, I'm not so sure where to go from here.</p>

<p>Could someone please assist?<br>
Thanks everyone.</p>

<p>Link to JSFiddle: <a href="http://jsfiddle.net/REbuy/1/" rel="nofollow">http://jsfiddle.net/REbuy/1/</a></p>

<p>Code Samples as Follows</p>

<p>jQuery:</p>

<pre><code>var speed = 2000;
function switcher(){
$('.next').animate({opacity:1}, speed, 'linear', function()
    {
        $('.current').removeClass('current');
        $(this).addClass('current');
        $('.next+li').addClass('next');
        $(this).removeClass('next');
        $('.next').css('opacity',0);
        checker();
    });
}

function checker(){
        if($('.w-slides li:last').hasClass('current'))
        {
            $('.w-slides li:first').addClass('next');
        }
        else if($('.w-slides li:first').hasClass('next') &amp;&amp; $('.w-slides li:last').hasClass('current'))
        {

            $('.w-slides li:first').addClass('current');        
            $('.w-slides li.current+li').addClass('next');
            $('.w-slides li:first').removeClass('next');
        }
    switcher();
    }
switcher();
</code></pre>

<p>HTML:</p>

<pre><code>&lt;div&gt;
    &lt;div class="w-fader"&gt;
        &lt;ul class="w-slides"&gt;
            &lt;li class="current"&gt;&lt;img src="fader-img-1.png" /&gt;&lt;/li&gt;
            &lt;li class="next"&gt;&lt;img src="fader-img-2.png" /&gt;&lt;/li&gt;
            &lt;li&gt;&lt;img src="fader-img-3.png" /&gt;&lt;/li&gt;      
        &lt;/ul&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>
