Creating a simple jQuery image slider

Creating a simple jQuery image slider

I am in the process of creating a simple image slider. The script works however it loads the second to last and last image/text at the same time on top of each other. It then takes about 7 seconds before it seems to oad the code and work.  http://project.josephmanning.com/jm Is the temp site while I develop the site.

HTML
  1. <div id="homeSlider">
  2. <div id="sliderWhole">
  3. <div id="slideShow">
  4. <div class="slideContainer show"><div class="textHover"><span><h5>O'Riada-McCarty-Manning Academy of Irish Dance</h5>Built with Wordpress, HTML/CSS, jQuery, Illustrator and Photoshop<br /><br /><a href="http://www.ommirishdance.com" target="_blank">Visit Site</a><br /><br /></span></div><img src="img/slider/omm.jpg" width="316" height="179" alt="" border="0" /></div>
  5. <div class="slideContainer"><div class="textHover"><span><h5>KC Feis</h5>Built with Wordpress, HTML/CSS, jQuery, Illustrator and Photoshop<br /><br /><a href="http://www.kcfeis.com" target="_blank">Visit Site</a></span></div><img src="img/slider/kcfeis.jpg" width="316" height="179" alt="" border="0" /></div>
  6. <div class="slideContainer"><div class="textHover"><span><h5>The Music Manning</h5>Built with Wordpress, HTML/CSS, jQuery, Illustrator and Photoshop<br /><br /><a href="http://www.themusicmanning.com" target="_blank">Visit Site</a></span></div><img src="img/slider/musicmanning.jpg" width="316" height="179" alt="" height="200" border="0" /></div>
  7. </div>
  8. </div>
  9. </div>

jQuery
  1.  $(document).ready(function() {
  2. ////Slider////
  3. slideShow();
  4. });

  5. function slideShow() {
  6.   var current = $('#slideShow div.show');
  7.   var next = current.next().length ? current.next() : current.siblings().first();

  8.   current.fadeOut('slow').removeClass('show');
  9.   next.fadeIn('slow').addClass('show');
  10.   
  11.   setTimeout(slideShow, 7000);
  12. }

Thanks