Bonjour à toutes et à tous,

Je mets en place un QCM pour tester mes élèves.
Pour cela j'ai créé plusieurs flexboxes avec différents calculs ainsi qu'un bouton pour valider la réponde et passer à la slide suivante.
Voici un extrait du code HTML :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
    <div class="quizz_window quizz_window_1">
      <p><u>Question n°1 :</u><br />
        Calculer : <br />
        <span id="alea"></span> <span id="nombre1"></span> <span id="operation1"></span> <span id="nombre2"></span> <span id="operation2"></span> <span id="nombre3"></span> =
      </p>
 
      <button id="quizz_button" onclick="suivant()" onclick="relatifs5()">
        <p>Valider</p>
      </button>
    </div>
    <div class="quizz_window quizz_window_2">
      <p><u>Question n°2 :</u><br />
        Calculer : <br />
        <span id="alea"></span> <span id="nombre1"></span> <span id="operation1"></span> <span id="nombre2"></span> <span id="operation2"></span> <span id="nombre3"></span> =
      </p>
 
      <button id="quizz_button" onclick="suivant()" onclick="relatifs5()">
        <p>Valider</p>
      </button>
    </div>

et ça c'est le javascript que j'essaie de créer (mais qui ne fonctionne pas du tout...)
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
function suivant() {
  const flexboxes = document.querySelectorAll(".quizz_window_");
 
  let currentFlexboxIndex = 0;
 
  flexboxes[currentFlexboxIndex].classList.add('hidden');
  currentFlexboxIndex++;
  if (currentFlexboxIndex >= flexboxes.length) {
    currentFlexboxIndex = 0;
  }
 
  flexboxes[currentFlexboxIndex].classList.remove('hidden');
}
Si quelqu'un à une solution, je suis preneur !
Merci d'avance !!