JSFiddle - React, Tailwind, and code Playground

HTML

<div class="mySlider">
<p>
Some text
</p>
</div>

CSS

.mySlider{
left: 0px;
height: 1000px;
width: 1000px;
-webkit-transition: background 1000ms ease-in 1000ms;
-moz-transition: background 1000ms ease-in 1000ms;
-o-transition: background 1000ms ease-in 1000ms;
transition: background 1000ms ease-in 1000ms;
}

JavaScript

jQuery( document ).ready(function() {

jQuery('.mySlider').css({"background-image" : "url(http://www.renders-graphiques.fr/image/upload/normal/Firefox.png)"});

var counter = 0;
function setBckImage(){
    if(counter<2){
        counter++;
    } else {
        counter=1;
    }


    switch (counter){
        case 1:
            jQuery('.mySlider').css({"background-image" : "url(http://www.renders-graphiques.fr/image/upload/normal/Firefox.png)"});
            break;
        case 2:
            jQuery('.mySlider').css({"background-image" : "url(http://www.babaimage.com/images/get-started-by-transparentlogos-tumblr-com-http-transparentlogos.png)"});
            break;
    }
}

if(jQuery('.mySlider').length) {
    setInterval(setBckImage, 5000);
}
});