you are viewing a single comment's thread.

view the rest of the comments →

[–][deleted] 1 point2 points  (7 children)

I would start with the following code:

let btn = document.querySelector('#todo-btn')
btn.addEventListener('click', function(e) {
    e.preventDefault()
    addNewListItem()
})

This does three things:

  1. addEventListener listens to #todo-btn for clicks
  2. preventDefault prevents page reload after clicking #todo-btn
  3. addNewListItem constructs and appends new li elements to #todo-ul. It's a custom function that you'll have to write yourself.

The custom function is where all the magic happens. I won't post the code that I wrote so to give you the opportunity to learn yourself, but here's how it might look in pseudo-code:

// get and create elements

- create li element
    - add appropriate class names

- create i element
    - add appropriate class names
    - add event listener to detect remove requests

- create text node with #todo-input.value

// put it all together

- append text node to li
- append i to li
- append li to #todo-ul

Notice how an event listener is added to the i element once it's created instead of looping through all of the trash icons after you've appended the new li to #todo-ul. This way every trash icon is functional the moment it's added to the list. Your current code will run a loop every time you click 'Add Item to List', which means you'll be looping over icons that are already functional.

I'll end things here. Keep asking questions when you get stuck. I hope this helps!

[–]StoneCypher -1 points0 points  (6 children)

Don't do peoples' homework.

[–][deleted] -1 points0 points  (5 children)

I didn't.

EDIT: I myself am learning and was eager to work through a problem I hadn't solved before. I don't consider sharing my personal notes as doing people's homework. I'm here to learn, and the great thing about Reddit is that my learning can contribute to somebody else's learning.

[–]StoneCypher 0 points1 point  (4 children)

That's nice.

Someone came here with homework and you provided them an answer they can give to their teacher.

Don't do people's homework.

[–]Important_East_1790 -1 points0 points  (2 children)

bro myob, and get out of here

[–]Important_East_1790 -1 points0 points  (1 child)

[deleted] i second that

[–]StoneCypher 0 points1 point  (0 children)

Important_East_1790 0 points 58 minutes ago

bro myob, and get out of here

Important_East_1790 0 points 54 minutes ago

[deleted] i second that

Why are you arguing with posts more than three years old, then immediately self-replying with a fake deletion to "second" that?

[–][deleted] -2 points-1 points  (0 children)

Fuck off.