Part 1: Use this sample web page.

https://github.com/minneapolis-edu/week5-jquery-examples/blob/master/lab-5-q1.html

Use JQuery selectors to do the following: When the page loads, make the elements bold When the

elements are clicked on, give them a green background (or another color of your choice) Make the

elements disappear when you hover over them with the mouse. They should appear when the mouse moves away. When the id="h1_blue" button is clicked, make all of the H1 elements blue. (or another color of your choice) When the id="remove_not_important" button is clicked, remove the li items with class = "not_important" When the items in the unordered list are clicked, make them slide away or fade out. Each item should fade individually - so if you click on the 3rd item, only the 3rd item should fade. The items in the ordered list should not slide away/fade out when clicked.

Part 2: To Do list in JQuery

Create a web page with an empty list, and an input box. You will use this to create a to do list. When you type something in the input box, it will be added to the to do list. Make sure you don't add empty items to the list.

Decide on one style to represent items that are not done.

Decide on another style to represent items that you have done; which will be list elements with the 'done' class. For example, you could use text-decoration: line-through; to put a line through the text. Or, another style of your choice.

Create a CSS stylesheet with one style for regular list items, and a different style for list items with the class 'done'.

When you click on one of your list items, it should toggle between done and not done. You should use the toggleClass method to add or remove the 'done' class; so that the appropriate CSS style is applied.

Part 3:Add a button to remove the items you have done. When you click the button, all of the list items that have the class 'done' will be removed.

Part 4: To Do List, move done items:

Modify so that when you click the remove button, remove this list item (or items); and add a row to a table on the same page. The new row will have the text of the item in one column, and the date that you marked it done in the second column. Make sure you don't re-add items to the table when you click the button multiple times.

Part 5: To Do List Animation:

Use the fade, or slide, or animate functions to animate the list items being deleted from the list and being added to the table.