title: A blank gap between last and first slide using .next() with jQuery
body: <p>See the <a href="http://jsfiddle.net/UfNZ2/" rel="nofollow">jsFiddle</a> and code below:</p>
  
  <pre><code>function slider() { 
      var activeSlide = $(".slideshow img.active");
      var firstSlide = $(".slideshow img:first-of-type");
      var lastSlide = $(".slideshow img:last-of-type");
  activeSlide                  
      .removeClass("active")      
      .next()                     
      .addClass("active");      
  if (activeSlide.length === 0) {
  firstSlide.addClass("active");
  }
  } 
  setInterval(function () {
  slider();
  }, 3000);
  </code></pre>
  
  <p>Once it gets to the last slide, there is a pause and blank gap before going back to the first slide.</p>
  
  <p>Any suggestions on how to fix this? When I inspect the element, I can see the "active" class looping through as it should, but it disappears for a second on the last one before re-appearing again on the first.</p>
  
  <p>Thanks in advance for any suggestions.</p>