JSFiddle - React, Tailwind, and code Playground
HTML
<div id="accordeon">
<h3>Informations d'inscription</h3>
<fieldset>
bla bla bla
<input type="button" id="1" value="Suivant"/>
</fieldset>
<h3>2eme élément </h3>
<fieldset>
bla bla bla
<input type="button" id="2" value="Suivant"/>
</fieldset>
<h3>3eme élément </h3>
<fieldset>
bla bla bla
<input type="button" id="3" value="Suivant"/>
</fieldset>
<h3>4eme élément </h3>
<fieldset>
bla bla bla
<input type="button" id="4" value="Suivant"/>
</fieldset>
</div>
JavaScript
$(document).ready(function(){
$("#accordeon").accordion({
collapsible : true,
heightStyle : "content",
navigation : false
});
$( "input[type=submit], input[type=button]" )
.button()
.click(function() {
var inputId = parseInt($(this).attr("id"));
// rend inacessible l'element en cours
$( $( "#accordeon > h3" )[inputId-1] ).addClass( "ui-state-disabled" );
$("#accordeon").accordion('option', 'active' , inputId); // active l'element suivant
});
});