JS ile todo uygulaması geliştiriyorum. Ard arda elemanları ekletebiliyorum ama silme işlemine geldiğimde hangi elamana tıkladığımı nasıl algılatabilirim?

Bu kodlar ile eleman oluşturuyorum.

function createLiElement(val) {
  return `
  <li class="task-item">
  <span class="task-time">${day}.${month}.${year} - ${hour}:${minute}</span>
  ${val}
  <span class="icons">
    <i id="trash" class="fa-solid fa-trash"></i>
    <i id="edit" class="fa-solid fa-pen"></i>
  </span>
  </li>
`;
}

Bu kodlarla tıkladığım elemanın bilgisini almaya çalışıyorum ama sadece 1. elemanın bilgisini alabiliyorum. 3 eleman olduğunu varsayın, sadece 1. elemanın bilgileri geliyor. 2. ve 3. elemana tıkladığımda bilgi alamıyorum.

function deleteLiElement(element) {
  console.log(element);
}

deleteBtn.addEventListener("click", (e) => {
  deleteLiElement(e.target.parentElement.parentElement);
});

Bilgisi olan varsa yardımcı olabilir mi?