JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<div id="BG01">01</div>
<div id="BG02">02</div>
<div id="BG03">03</div>
<div id="BG04">04</div>
</div>
JavaScript
var b=0;
var a=1;
function setInterval(){
if (b==0) {
$('#BG0' + a).css({
"display": "block",
"z-index": "10",
"opacity": "1"});
b=2;
}
else {
if (b===5) {
b=1;
$('#BG0' + a).css("z-index", "1");
$('#BG0' + b).css({
"z-index": "10",
"display": "block",
"opacity": "1"});
$('#BG0' + a).css({
"z-index": "-99",
"display": "none",
"opacity": "0"});
a=b;
b+=1;
}
else {
$('#BG0' + a).css("z-index", "1");
$('#BG0' + b).css({
"z-index": "10",
"display": "block",
"opacity": "1"});
$('#BG0' + a).css({
"z-index": "-99",
"display": "none",
"opacity": "0"});
a=b;
b+=1;
}
}
}
setInterval();