Project: A To-do List

Get introduced to the project and its challenges.

We'll cover the following


To better understand jQuery applications, we will be working on an interactive project. In this project, we will add jQuery functionality to a “to-do list” webpage. The project will build incrementally and be divided into six sub-tasks:

  • Assigning a click event handler
  • Adding a task in the todo list
  • Deleting a task from the todo list
  • Moving a task from todo to done
  • Moving and removing tasks with effects
  • Importing tasks to the to-do list from a server

Each of the sub-tasks will provide a hands-on experience meant to test the functionality learned in a given chapter.

Final Preview

Below is a preview of what the final project will look like after adding jQuery functionality.

You can play around with the web page by adding, deleting, or updating a task while focusing on its interactivity and functionality.

Final Project Preview