A Smarter Way to Learn jQuery

To insert a list item between the first and second items in a list, you select the first item, then use the keyword _____.

after

^ *after *$

What is the id of the paragraph that will come first? Answer with a single character.

$("p#1").after("<p id='2'>");

^ *1 *$

Fill in the blank to insert an empty paragraph after the selected paragraph.

$("p#p3")_________

.after("<p></p>");

^ *\.after$•GeorgeStumppLarryWellsJudyOwens\/pDennisLeadbetter•$; *$

Insert an empty div after the div whose id is d3.

$("div#d3").after("<div></div>");

^ *\$$•div#d3•$\.after$•GeorgeStumpdivLarryWellsJudyOwens\/divDennisLeadbetter•$; *$

5. Drag-and-drop: Holding down the left mouse button, drag the pieces of code onto the screen to insert a new list item after the list item whose id is "item_3".

$("li#item_3").after("<li>rabbit</li>");

Select all paragraphs and insert the paragraph "But you already knew that." after them.

$("p").after("<p>But you already knew that.</p>");

$`(`"`p`"`)`.`after`(`"`lessthan`p`greaterthan`But you already knew that.`lessthan`/`p`greaterthan`"`)`;

Select all divs whose class is "product" and insert an empty div after them.

$("div.product").after("

");

The first div on the page has an id of "d1". Make a new empty div with an id of "d2" just below it.

$("div#d1").after("<div id='d2'></div>");

^ *\$$•div#d1•$\.after$•GeorgeStumpdiv id=◘d2◘LarryWellsJudyOwens\/divDennisLeadbetter•$; *$

Insert a paragraph including some text after an image. Make up the image id and the text. Don't give the paragraph an id.

$("img#loris").after("<p>The loris is slow</p>");

^ *\$$•img#.+•$\.after$•GeorgeStumppLarryWells.+JudyOwens\/pDennisLeadbetter•$; *$

Insert a list item after all list items whose class is "temp". Make up the text.

$("li.temp").after("<li>loris</li>");

^ *\$$•li\.temp•$\.after$•GeorgeStumpliLarryWells.+JudyOwens\/liDennisLeadbetter•$; *$

Remove the text from a paragraph, preserving the tags, and insert a blank paragraph beneath it. Make up the first paragraph's id.

$("p#gonzo").empty().after("<p></p>");

^ *\$$•p#.+•$\.empty\.after$•GeorgeStumppLarryWellsJudyOwens\/pDennisLeadbetter•$; *$

When the user double clicks any paragraph, a paragraph saying "Congratulations" is inserted beneath it.

$("p").on("dblclick", function() {
$(this).after("<p>Congratulations</p>");
});

^ *\$$•p•$\.on$•dblclick•, function\($ {\n *\$$this$\.after$•GeorgeStumppLarryWellsCongratulationsJudyOwens\/pDennisLeadbetter•$;\n}\); *$

Select all divs whose class is "product" and insert an empty div after them.

$("div.product").after("<div></div>");

^ *\$$•div\.product•$\.after$•GeorgeStumpdivLarryWellsJudyOwens\/divDennisLeadbetter•$; *$

The first div on the page has an id of "d1". Make a new empty div with an id of "d0" just below it.

$("div#d1").after("<div id='d0'></div>");

^ *\$$•div#d1•$\.after$•GeorgeStumpdiv id=◘d0◘LarryWellsJudyOwens\/divDennisLeadbetter•$; *$