Erro em código Slideshow

Boa tarde galera.

Sou iniciante em HTML, CSS, JS... e tudo mais. Achei um slideshow simples na internet (apenas para passagem de imagens) e gostaria de colocá-lo em um site que estou fazendo. A questão é que usando o código o slide inicia com a imagem final, depois vai pra segunda volta pra final, vai pra terceira... até chegar na quinta imagem. Após isso ele começa a funcionar normal. No modelo da internet possuía 3 imagens, adaptei para 5 (não sei se influencia em algo). Alguém poderia dizer o que há de errado nesse código?

HTML

<div id="slideshow">
 <div><img src="img/Banner2-1.jpg"></div>
 <div><img src="img/Banner2-2.jpg"></div>
 <div><img src="img/Banner2-3.jpg"></div>
 <div><img src="img/Banner2-4.jpg"></div>
 <div><img src="img/Banner2-5.jpg"></div>
</div>

CSS

#slideshow {
 margin: 50px auto;
 position: relative;
 width: 900px;
 height: 300px;
 padding: 0px;
 box-shadow: 0 0 30px rgba(0,0,0,0.3);}

#slideshow > div {
position: absolute;}

JS

<script src="jquery/jquery 1.5.2.js"></script>
<script>
 $("#slideshow > div:gt(0)").hide();

 setInterval(function() {
 $('#slideshow > div:first')
 .fadeOut(1000)
 .next()
 .fadeIn(1000)
 .end()
 .appendTo('#slideshow');
}, 4000);

</script>

Agradeço pela ajuda.