Why does JS script only act on the first checkbox in the list?

JavaScript
1

Hi all, sorry for what may be a silly question but I’m very new to Javascript and am having an issue that I need help with.

I have a basic HMTL page with a list of 10 checkboxes that I want to be able to generate a text output when they are checked. Some of the checkboxes should say Correct and some Incorrect.

I have used the script below but it only seems to work for the first checkbox in the list and none of the others.

function myFunction() {
  
  var checkBox = document.getElementById("low-visibility");
  
  var text = document.getElementById("text");

  if (checkBox.checked == true){
    text.style.display = "block";
  } else {
    text.style.display = "none";
  }
}
2

I don’t know what level of knowledge you have, but might it be worth looking into events and event handlers first? e.g. click and it does this — A simple task to begin with.

I went through the following vid at double speed, but it seems to be a straightforward introduction to that.

For a more comprehensive breakdown

3

Awesome thank you very much. I’m a novice at JS therefore this will be very useful.

1 Like
4

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.