I’m a chronic list maker. What better way to use my jQuery skills than to create a simple to-do list maker using jQuery.
Steps to create a simple tack list maker using jQuery
- Create an input text field for the user to add the task.
- Create an “ADD” button.
- Create an empty unordered list div.
- On button click event, get the text inside the text field.
- Append a new list item to the div.
- On the click event of the item, remove the list item from the DOM. This will delete the task from the list.

A sampling of the code.
$(document).ready(function(){
$('#button').click(function(){
var toAdd = $('input[name=checkListItem]').val();
$('.list').append("
<div class='item'>" + toAdd + "</div>
");
});
$('.list').click(function(){
});
});
$(document).on('click', '.item', function(){
$(this).remove();
});
I hope you found this article interesting.