Ah, my whiskers! Ah, my ears! I’ve got just so many things to do!..

And by the way, how much? Is it so much? Without a good list, it’s very difficult to keep track of everything. And it’s even harder to finish what you started. Muffin set about creating an automated list of tasks, but then he gave up. It would be nice if we were to get his program into shape.

The list of tasks is already on the page. To create a new task, the user must enter the text for this task in the input field. Tasks have different priorities. You can select it by clicking on the toggle switcher button. If a high priority is selected, the button says “Important task”, and if the priority is regular, it says “Regular task”. Click the “Add to List” button in order to add a new task to the end of the list of tasks.

The layout is completely ready. Muffin even wrote some JavaScript code for it. We have already found the list of tasks, the form for adding a new task, the input field and the priority switcher, and they have been saved as variables. Event handlers have been added to the priority switcher and form.

1. Each time the priority switcher is clicked (priority variable), the is-important class is switched. If there is a class, then the priority is high; and if there is no class, then the priority is regular.
2. If the priority is high, then the text content of the switcher is 'Important task'. If priority is regular, then the text content is 'Regular task'.
3. Each task in the list is assigned its own li element. When a form is submitted (form variable), a new task is added to the end of the list (list variable).
4. The text of the task is taken from the input field (input variable)
5. If a high priority has been set, the is-important class is added to the new task.
6. Bonus task: After the task is added to the list, the input field can be cleared. But you do not have to clear it. Muffin doesn’t care which option you use.