javascript checkbox line-through

I am trying to do a school project. I have to make a list and after the checkbox is clicked supposed to be crossed off. I don’t know Javascript yet and I’m still trying to figure it out. I am wondering why this isn’t working.

function  crossout(id) {
  var box = document.getElementById(id);
  box.style = "text-decoration: line-through";
}
  <body>
    <h1>Hello World!</h1>
    <h3>Shopping List</h3>
    <p id="box1">
      <input type="checkbox" onclick="crossout"("box1") />
      Banana
    </p>
    <p id="box2">
      <input type="checkbox" onclick="crossout"("box2") />
      Noodles
    </p>
    <p id="box3">
      <input type="checkbox" onclick="crossout"("box3") />
      Eggs
    </p>

    <script src="app.js" charset="utf-8"></script>
  </body>

Answer

You have a typo in your checkboxes:

onclick="crossout"("box1")

This should be:

onclick="crossout('box1')"

Your original way set onclick only to "crossout".

Leave a Reply

Your email address will not be published. Required fields are marked *