JSFiddle - React, Tailwind, and code Playground

by Alexandre Simoes

HTML

<div class="mainlist" style="display: block;">Div 1</div>
<div class="mainlist" style="display: none;">Div 2</div>
<div class="mainlist" style="display: none;">Div 3</div>
<div class="mainlist" style="display: none;">Div 4</div>

<input type="button" class="nextStep" value="Next" />

CSS

div.mainlist {
  padding: 5px;
  border: solid 1px #000;
}

JavaScript

$('input.nextStep').on('click', function(){
	
  var current = $('div.mainlist:visible') || $('div.mainlist').first();
  current.hide().next().show();
  
});