0

I made the Todo list in JavaScript. I just use JavaScript. I want the work to be completed when the <li> element is pressed on. I created a method for this. how do I do this process?

.completed {
      text-decoration: line-through;
    }

I want the post drawn when it is complete. I have prepared a CSS for it

let todos = [
  {
    id: 1,
    title: "Javascript",
    completed: true
  },
];

function render() { /* I list object */
  flen = todos.length;
  text = "<ul id=myUL>";
  for (i = 0; i < flen; i++) {
    text +=
      '<li  id="' +
      todos[i].id +
      '">' +
      todos[i].title +

      "</li>";
  }
  text += "</ul>";
  document.getElementById("demo").innerHTML = text;
}
render();


function completedTodo(e) { /*it's method */

}
Atakan
  • 91
  • 1
  • 8
  • 1
    What is the purpose of this function ? How do you define *completed* ? What have you tried for this function ? – Weedoze Jul 24 '19 at 06:23
  • We don't know what "completing the work" means in the context of your app. Does the item simply disappear? Change color with a strikethrough? Move to a "completed section"? Please update your post with the relevant information to get better help. – Austin Schaefer Jul 24 '19 at 06:23
  • @Weedoze, @Austin Who cares what the function does? How is that relevant info? OP needs to attach a click listener to the `li` elements which will call the function. See this: https://stackoverflow.com/questions/3316207/add-onclick-event-to-newly-added-element-in-javascript – Shomz Jul 24 '19 at 06:25
  • you need a delegated event listener, – Jaromanda X Jul 24 '19 at 06:26
  • @Shomz I think that the question is simply not clear enough. OP is saying `how do I do this process?` - I understand it as *process* means the algorithm to complete a task. – Weedoze Jul 24 '19 at 06:30

1 Answers1

1

Attach an event listener to the li and then when clicked you add the class of completed to it.

document.querySelectorAll('li')
 .forEach((item) => {
   item.addEventListener('click', () => {
     item.className += " completed";
   })
})
alberto montalesi
  • 978
  • 11
  • 17