Change <li> into <input> - DOM

Hi there,

Here is the link to my project CodePen.
How can I make my task to be editable by clicking Edit button? I thought about adding input which will be display: none at the beginning. Is it possible with current code or do I have to refactor it?
Thank you,
Kuba

You could add contenteditable attribute, but because your li contains both buttons you won’t have desired result anyway.

  } else if (e.target.className === "editButton") {
    e.target.parentNode.setAttribute("contenteditable", "true");
    // alert("clicked edit button");
  }