JSFiddle - React, Tailwind, and code Playground

HTML

<div class="picCon"></div>

JavaScript

var theImages = ['http://www.indianetzone.com/photos_gallery/10/IndianFruits_19448.jpg','http://www.healthhype.com/wp-content/plugins/fruits.jpg','http://www.salmonellablog.com/uploads/image/fruits_vegetables.jpg'];

    var imgIndex = 0;
$(function(){
    SlideImages();
});

    function SlideImages()
    {  $("<img/>")
        .one('load',function(){
            $('div.picCon img').show('bounce',1000,function(){
                setTimeout( hideImg,2000);
                });
            })
        .css('display','none')
        .attr("src",theImages[imgIndex])
        .appendTo("div.picCon")
        .each(function(){
            if (this.complete) $(this).trigger('load');
            });            
    }

    function hideImg()
    {
        $("div.picCon img").fadeOut(function(){
            $("div.picCon").empty();
            imgIndex = (imgIndex<theImages.length-1)?imgIndex+1:0;
            SlideImages();
        });

    }