JSFiddle - React, Tailwind, and code Playground

by skowron_line

HTML

<div class="slider">a</div>
		<div class="slider">b</div>
		<div class="slider">c</div>
		<div class="slider">d</div> 
		<div class="slider">e</div> 
		<div class="slider">f</div> 
		<div class="slider">g</div> 
		<div class="slider">h</div>

CSS

.slider {
    display: none;
    margin: 0;
}
.slider:first-child {
    display: inline-block;
}

JavaScript

var s = $('.slider'), i = 0;
setInterval(function(){
	var o = $([]);
		o = o.add(s[i]);
	if(i === s.length - 1) {
		i = -1;
	}
	i++;
	o = o.add(s[i]);
	
	o.toggle();
}, 1000);