• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

109
Views
Strike through each list item

I'm a few months into learning JavaScript and currently working on a shopping list project.

I want to be able to apply a strike through the list items when they are clicked on. However,after some time working on this, it does not allow me to do so. My attempt can be seen below in the function removeNeedItem. Can someone kindly have a look through my code and offer any suggestions?

Thank you in advance.

<body>
    <div class="container">
      <h1><em>Shopping List</em></h1>
      <!-- Textbox -->
      <div class="form-wrap">
        <label><strong>Add Item: </strong></label>
        <input type="text" name="item-name" id="textbox" />
        <div class="buttons">
          <button class="input-btn" id="need-btn">Need</button>
          <button class="input-btn" id="own-btn">Have</button>
        </div>
      </div>
      <!-- Lists -->
      <h2 class="lists">Need to Buy</h2>
      <ul id="need-list"></ul>
      <h2 class="lists">Already Own</h2>
      <ul id="own-list"></ul>
    </div>
  </body>
var grocNeedList = [{ item: "Salmon", Required: true }];

function displayNeedList() {
  var needListUl = document.getElementById("need-list");
  needListUl.innerHTML = "";

  for (var i = 0; i < grocNeedList.length; i++) {
    grocNeedList[i].item;
    var listItem = document.createElement("li");
    listItem.innerText = grocNeedList[i].item;
    needListUl.appendChild(listItem);

    listItem.id = i;
    listItem.setAttribute("onclick", "removeNeedItem(event)");
  }
}

function removeNeedItem(event) {
  var position = event.currentTarget.id;
  position.style.textDecoration = "line-through";
  displayGroc();
}

var addInput = document.getElementById("textbox");
needButton.addEventListener("click", addNeedItem);
almost 3 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error