Disable others inputs on click

Question

      answerElement.addEventListener("click", () => { // Evénement pour mettre une couleur si c'est juste ou faux
  
    CreateLabel.style.backgroundColor = "white"; // On set le style a blanc de base
    if (value[i].propositions[j] == value[i].réponse) {

      CreateLabel.style.backgroundColor = "green"; // On set le style a green quand c'est juste
  
      console.log(answerElement)
      answerElement.disabled = true;

      const anecdoteElement = document.createElement("p");

      const anecdoteNode = document.createTextNode(value[i].anecdote); // Crée l'anecdote quand c'est juste


      anecdoteElement.appendChild(anecdoteNode);
      CreateLabel.appendChild(anecdoteElement);

    } else {
      CreateLabel.style.backgroundColor = "red";  // On set le style a green quand c'est juste
      answerElement.disabled = true;

    }
  })

Hi, here is my problem, I want to click disable the 3 other inputs, here my input is answerElement, except what I did disable the input on click, but I want to disable the other 4 on click and I can't find it

 for (let i = 0; i < value.length - 10; i++) {
var score = 0;
const QuestElement = document.createElement("h2"); // Ici on crée toute les question en fonction la taille de value, ici 30 - 10 (-10 pour pas que ce soit les mêmes questions)
const QuestNode = document.createTextNode(value[i].question); // Ici on crée un textnode pour mettre les questions dans h2
QuestElement.appendChild(QuestNode); // Ici on le fait spawn

answersDiv.appendChild(QuestElement);

for (let j = 0; j <= 3; j++) {
  // Ici c'est pour crée les Propositions pour chaque questions
  const answerElement = document.createElement("input"); // On crée un input
  answerElement.id = "salut" + j;
  answerElement.value = j;
  answerElement.type = "radio"; // le Type = radio
  answerElement.name = "input";
  answerElement.classList = "input";

  const CreateLabel = document.createElement("label"); // On crée le label pour les inputs
  CreateLabel.classList = "Label";
  CreateLabel.name = "input";

  CreateLabel.setAttribute("for", "salut" + j); // Ici on le setUnAttribut
  const answerNode = document.createTextNode(value[i].propositions[j]); // On crée le TextNode

Answer 1

Wrap <form> around all of the <input>s. Add the event listener to the <form> and have the event handler delegate the click event for the <input>s. Wrap each set of 4 <input>s in a <fieldset> and reference them from the clicked <input>. Also a function nameRadios() has been added so that each set of 4 radios will share a unique name. See event delegation.

Details are commented in example below

// Reference the <form>
const form = document.forms[0];
// Pass the event object
const switchInput = event => {
  // This is the <form>
  const listener = event.currentTarget;
  // This is the element the user clicked
  const clicked = event.target;
  /*
  if the element the user clicked was
  an <input>...
  */
  if (clicked.matches('input')) {
    // ...reference the <fieldset> clicked is in...
    let fSet = clicked.parentElement;
    // ...collect all of the <input>s in an array...
    let answers = [...fSet.querySelectorAll('input')];
    //...disable all <input>...
    answers.forEach(input => input.disabled = true);
    //...then enable clicked
    clicked.disabled = false;
  }
};
/*
Have the <form> listen for any clicks
*/
form.onclick = switchInput;

const nameRadios = () => {
  // Collect all radios into an array
  const allRadios = [...document.querySelectorAll(`[type='radio']`)];
  // Each set of 4 radios get a unique name
  for (let i = 0; i < allRadios.length; i++) {
    let q = Math.floor(i / 4);
    allRadios[i].name = `rad${q}`;
  }
};

nameRadios();

<form>
  <fieldset>
    <input type='radio'><br>
    <input type='radio'><br>
    <input type='radio'><br>
    <input type='radio'><br>
  </fieldset>
  <fieldset>
    <input type='radio'><br>
    <input type='radio'><br>
    <input type='radio'><br>
    <input type='radio'><br>
  </fieldset>
  <fieldset>
    <input type='radio'><br>
    <input type='radio'><br>
    <input type='radio'><br>
    <input type='radio'><br>
  </fieldset>
</form>

Answer 2

What you probably want to do is to select all other radio input beside answerElement and disable them all:

document.querySelectorAll(`[name=${answerElement.name}]`).forEach(
  (otherAnswer)=> {
    otherAnswer.disabled = true;
  }
);