Using jquery to apply and remove different styles. The first link removes any existing styles and wrap the content in an unordered list. The third link removes any applied styles and returns to the default state.The second link should remove any existing styles and wrap the content in an ordered list.

The second link is not working, and I can't figure out why as the syntax works for the first one. Any suggestions? All of code included below. Change Text Formatting part 2

$(document).ready(function() { //format to unordered list $("#bullets").click(function(event) { event.preventDefault(); if(this.id == "bullets") { $("#list").unwrap(); $("span").unwrap(); } $("#list").wrap("

"); $("span").wrap("

"); }); //format to ordered list $("#ordered").click(function(event) { event.preventDefault(); if(this.id == "ordered") { $("#list").unwrap(); $("span").unwrap(); } $("#list").wrap("

"); $("span").wrap("

"); }); //remove formatting $("#remove").click(function(event) { event.preventDefault(); $("#list").unwrap(); $("span").unwrap(); }); });

My favorite book series is the "Harry Potter" series by J.K. Rowling. There are a total of seven books in the main series, with a handful of short stories and extras published.

Here are the titles of the seven books:

Add bullets Add numbers Remove Formatting

Harry Potter and the Sorcerer's Stone Harry Potter and the Chamber of Secrets Harry Potter and the Prisoner of Azkaban Harry Potter and the Goblet of Fire Harry Potter and the Order of the Phoenix Harry Potter and the Half-Blood Prince Harry Potter and the Deathly Hallows