Solution Review: Adding a Task in the To-Do List

Solution

Explanation

• In lines 4-6, we create a div task element with the class set to task (line 5) and the text equal to the value of the textbox (line 6).

• In lines 8-9, we create a delete button element with the id set to delete (line 8) and the class set to fas fa-trash-alt (line 9).

• In lines 11-12, we create a done button element with the id set to done (line 11) and the class set to fas fa-check (line 12).

• In line 14, we append the delete and the done button elements to the newly created task element.

• In line 16, we append that task element to the div with class notCompleted and add it to the to-do list. Then the new task element, along with its children button elements, is added to the DOM tree and can be seen in the webpage.