JSFiddle - React, Tailwind, and code Playground
HTML
<head>
<script type="text/javascript">
function displayquestion(a){
var questions = document.getElementsByClassName("questionholder");
for(var i=0; i < questions.length; i++) {
questions[i].style.display = "none";
}
var nextQuestion = document.getElementById("question" + a);
if(nextQuestion !== null) {
nextQuestion.style.display = "block"
}
}
</script>
</head>
<form id="TheForm" style="display:block;">
<div class="questionholder" id="question0" style="display:block">
<script type="text/javascript">
if (submitted == "yes") {
document.write("<h5>Try Again! / Recommencer!</h5><br>");
} else {
document.write("<h5>Welcome! / Bienvenue!</h5><br>");
}
</script>
<a class="text2button" onclick="displayquestion(1)">Start / Commencer</a>
</div>
<div class="questionholder" id="question1" style="display:none">
<h5>Requested Surname <br> Nom de Famille Demandé</h5>
<input id="required" name="REQln"><br>
<a class="text2button" onclick="displayquestion(2)">Next / Suivant</a>
</div>
<div class="questionholder" id="question2" style="display:none">
<h5>Requested Given Name <br> Prénom Demandé</h5>
<input name="REQgn"><br>
<a class="text2button" onclick="displayquestion(3)">Next / Suivant</a>
</div>