Build: The Web

Making a todo list

Make a new folder called "todo" in your file system. Create three new files in the folder: index.html, style.css, and script.js.
To the index.html file, add the following.
Alternatively, you can utilize an online editor to create a new project; in this example, we'll use Codepen. Open a new pen by clicking here.
Add the following code in your body tag of the index.html.
The main tag is used as a parent tag for all other tags. The h3 tag has a title and the form is used to collect data input by the user which will be displayed in the ul tag. H4 tag has some information for the user.
Add the following styles to your style.css.
The css style styles the html, feel free to style the todo list to one’s liking.
Added the following code to your script.js.
Select the form and ul tag using the document.querySelector() method. Add an event listener to the selected form tag. The event is an on submit event. The moment the form is submitted, the code in the submit function runs. The submit function creates an li tag with the value of the inputted form value and appends it to the ul tag that was selected earlier.