Slideshow transition in javascript

I cant seem to get this slide show to work with javascript. the image fades in and out correctly on the first image but when transitioning for the second image it seems to immediately skip to the image instead of transition like the previous.

            <script type="text/javascript">

            var images = ["image1.png", "image2.png", "image3.jpg"];
            var imagecount = 0;
            window.setInterval(setImage,5000);
                function setImage(){
                    $('.bgimage').fadeIn(5000);
                    $('.bgimage').css('background-image','url('+images[imagecount]+')');
                    $('.bgimage').fadeOut(5000);
                    imagecount++;       
                    if(imagecount > 2){
                        imagecount=0;
                        }       
                    }

            </script>