const ul = document.querySelector("ul")
// ul.remove()
// const items = document.querySelectorAll("li")

const button = document.querySelector("button")

button.addEventListener("click", (e) => {
    // ul.innerHTML += "<li>something new</li>"
    const li = document.createElement("li")
    li.textContent = "something new to do"
    // ul.append(li)
    ul.prepend(li)
})

// items.forEach(item => {
//     item.addEventListener("click", (e) => {
//         // e.target.style.textDecoration ="line-through"
//         // e.target.remove()
//         e.stopPropagation()
//         console.log("LI Clicked")
//     })
// })

ul.addEventListener("click", (e) => {
    // console.log("UL Clicked")
    // console.log(e.target)

    if (e.target.tagName === "LI") {
        e.target.remove()
    }
})