JSFiddle - React, Tailwind, and code Playground

by crazzzy

HTML

<div id="container">
  <div class="active">Один</div>
  <div>Два</div>
  <div>Три</div>
  <div>Четыре</div>
  <div>Пять</div>
  <div>Шесть</div>
</div>

<div><button id="next_btn">Следующий</button></div>

CSS

#container > div {
  display: none;
}

#container > .active {
  display: block;
  background: yellow;
  padding: 10px;
}

JavaScript

$(document).ready(function() {
	$('#next_btn').click(function() {
  	var $next = $('#container > .active').next();
    $('#container > div').removeClass('active');
  	$next.addClass('active');
  });
});