WEB230: JavaScript 1Final Project–To-DoList

This is a project. You are not allowed to discuss this project with anyone. It is to test your overall ability in JavaScript. You are allowed to research content on the internet, but you may not post questions, or use any code that you did not write. In this project, you will write code to create a Todolist. You are provided with HTML, CSS and a skeleton file. Look at the HTML and CSS file to get an understanding of how to select and manipulate your DOM elements. When researching online, you are allowed to look for guidelines. DO NOT copy and paste the code. That is considered cheating. NOTES• DO NOT modify the HTML or CSS files. Doing so will lose you marks.• Include a comment in the JavaScript file with your name, student number, and the date.• Follow best practices as discussed during the lecture.o Use camel-casing for variable names.o Remember to use letor constvariables.•Zip the folder containing the project files before submitting. Please submit in a zip format. Do not use any other archive formats (RAR, 7zip, tar, etc.).REQUIREMENTS For this final project, the to-do list must have:•When you create a new section, it should create a new divelement with a class named section, and idsectionwith a title. Example is provided in the index.htmlfile.oSection should have their own buttonto create their own items within’that section.•When clicking on the lielement, it should toggle the classstrikethrough, to signal that it isdone.oMake sure that this is done through event delegation on the ul element. (Remember to use tagName to identify for li).•Adding a new item should appropriately add the new item to that section.•Programmatically addyour own name as a pelement, and console logged your studentnumber onconsole.

WEB230: JavaScript 1PREVIEWBONUS•Have a button for each section that sorts the to-dolist alphabetically.(5 marks)•Have a button that removes all the finished to-do list items (those that are marked with a strikethrough).(5 marks) there's the requirements