A Smarter Way to Learn jQuery

Read the text in the paragraph whose ID is "p2" and store it in a variable of your choice.

var contents = $("p#p2").text();

^ *var .+ = \$$•p#p2•$\.text; *$

Insert HTML, including an opening and closing tag and some text, in a div. Make up the div's ID.

$("div#second").html("Have a nice day.");

^ *\$$•div#.+$\.html$•<.+>.+<\/.+>•$; *$

Read the HTML in a paragraph whose ID is an ID of your choice. Store it in a variable of your choice.

var html6 = $("p#sixth").html();

^ *var .+ = \$$•.+#.+•$\.html; *$

Insert some text of your choice--a text string itself not a variable--into a paragraph whose ID is an ID of your choice.

$("p#intro").text("Hello there.");

^ *\$$•p#.+•$\.text$•.+•$; *$

5. Drag-and-drop: Holding down the left mouse button, drag the pieces of code onto the screen to insert the text in a paragraph whose ID is "p2" into a paragraph whose ID is "p18".

$("p#p18").text($("p#p2").text());

Read the HTML in a div whose ID is "d3" and store it in the variable contents.

var contents = $("div#d3").html();

var`1spacecontents`1space=`1space$`(`"`div`#`d3`"`)`.`html`(`)`;

Insert the string "wombat" in the form field whose ID is "animal".

$("input#animal").val("wombat");

Read the text in a list item whose ID is "item4" and store it in a variable of your choice.

var contents = $("li#item4").text();

^ *var .+ = \$$•li#item4•$\.text; *$

Insert the text stored in the variable filler in all h3 headings whose class is "whatever".

$("h3.whatever").text(filler);

^ *\$$•h3\.whatever•$\.text$filler$; *$

Insert HTML of your choice, including an opening and closing tag and some text, in a heading--your choice of heading size and ID.

$("h2#notice").html("Note well");

^ *\$$•h[1-6]#.+•$\.html$•<.+>.+<\/.+>•$; *$

Insert a string of your choice into a form field whose ID is an ID of your choice.

$("input#name").val("Mark");

^ *\$$•input#.+•$\.val$•.+•$; *$

Insert text from a form field into a paragraph. Make up the IDs of both the form field and the paragraph.

$("p#id1").text($("input#name").val());

^ *\$$•p#.*•$\.text$\$\(•input#.*•$\.val\); *$

Insert the string "wombat" in the form field whose ID is "animal".

$("input#animal").val("wombat");

^ *\$$•input#animal•$\.val$•wombat•$; *$

Read the text in a list item whose ID is "item4" and store it in a variable of your choice.

var contents = $("li#item4").text();

^ *var .+ = \$$•li#item4•$\.text; *$

Insert the text stored in the variable filler in all h3 headings whose class is "whatever".

$("h3.whatever").text(filler);

^ *\$$•h3\.whatever•$\.text$filler$; *$

Insert HTML of your choice, including an opening and closing tag and some text, in a heading--your choice of heading size and ID.

$("h2#notice").html("Note well");

^ *\$$•h[1-6]#.+•$\.html$•<.+>.+<\/.+>•$; *$

Insert a string of your choice into a form field whose ID is an ID of your choice.

$("input#name").val("Mark");

^ *\$$•input#.+•$\.val$•.+•$; *$

Insert text from a form field into a paragraph. Make up the IDs of both the form field and the paragraph.

>$("p#.+").text($("input#.+").val());

^ *\$$•p#.+•$\.text$\$\(•input#.+•$\.val\); *$

http://jsfiddle.net/ASmarterWayToLearn/ou4rwbyw/

http://jsfiddle.net/ASmarterWayToLearn/we8j63tL/

Read the text in the paragraph whose ID is "p2" and store it in a variable of your choice.

var contents = $("p#p2").text();

^ *var .+ = \$$•p#p2•$\.text; *$

Insert HTML, including an opening and closing tag and some text, in a div. Make up the div's ID.

$("div#second").html("Have a nice day.");

^ *\$$•div#.+$\.html$•<.+>.+<\/.+>•$; *$

Read the HTML in a paragraph whose ID is an ID of your choice. Store it in a variable of your choice.

var html6 = $("p#sixth").html();

^ *var .+ = \$$•.+#.+•$\.html; *$

Insert some text of your choice--a text string itself not a variable--into a paragraph whose ID is an ID of your choice.

$("p#intro").text("Hello there.");

^ *\$$•p#.+•$\.text$•.+•$; *$

5. Drag-and-drop: Holding down the left mouse button, drag the pieces of code onto the screen to insert the text in a paragraph whose ID is "p2" into a paragraph whose ID is "p18".

$("p#p18").text($("p#p2").text());

Read the HTML in a div whose ID is "d3" and store it in the variable contents.

var contents = $("div#d3").html();

var`1spacecontents`1space=`1space$`(`"`div`#`d3`"`)`.`html`(`)`;

Insert the string "wombat" in the form field whose ID is "animal".

$("input#animal").val("wombat");

Read the text in a list item whose ID is "item4" and store it in a variable of your choice.

var contents = $("li#item4").text();

^ *var .+ = \$$•li#item4•$\.text; *$

Insert the text stored in the variable filler in all h3 headings whose class is "whatever".

$("h3.whatever").text(filler);

^ *\$$•h3\.whatever•$\.text$filler$; *$

Insert HTML of your choice, including an opening and closing tag and some text, in a heading--your choice of heading size and ID.

$("h2#notice").html("Note well");

^ *\$$•h[1-6]#.+•$\.html$•<.+>.+<\/.+>•$; *$

Insert a string of your choice into a form field whose ID is an ID of your choice.

$("input#name").val("Mark");

^ *\$$•input#.+•$\.val$•.+•$; *$

Insert text from a form field into a paragraph. Make up the IDs of both the form field and the paragraph.

$("p#.+").text($("input#.+").val());

^ *\$$•p#.+•$\.text$\$\(•input#.+•$\.val\); *$

Insert the string "wombat" in the form field whose ID is "animal".

$("input#animal").val("wombat");

^ *\$$•input#animal•$\.val$•wombat•$; *$

Read the text in a list item whose ID is "item4" and store it in a variable of your choice.

var contents = $("li#item4").text();

^ *var .+ = \$$•li#item4•$\.text; *$

Insert the text stored in the variable filler in all h3 headings whose class is "whatever".

$("h3.whatever").text(filler);

^ *\$$•h3\.whatever•$\.text$filler$; *$

Insert HTML of your choice, including an opening and closing tag and some text, in a heading--your choice of heading size and ID.

$("h2#notice").html("Note well");

^ *\$$•h[1-6]#.+•$\.html$•<.+>.+<\/.+>•$; *$

Insert a string of your choice into a form field whose ID is an ID of your choice.

$("input#name").val("Mark");

^ *\$$•input#.+•$\.val$•.+•$; *$

Insert text from a form field into a paragraph. Make up the IDs of both the form field and the paragraph.

>$("p#.+").text($("input#.+").val());

^ *\$$•p#.+•$\.text$\$\(•input#.+•$\.val\); *$

http://jsfiddle.net/ASmarterWayToLearn/ou4rwbyw/

http://jsfiddle.net/ASmarterWayToLearn/we8j63tL/

A Smarter Way to Learn jQuery / Chapter 7 Exercises

Congratulations. You've successfully completed all the exercises for this chapter.

Comments? Email me.

Read the text in the paragraph whose ID is "p2" and store it in a variable of your choice.	var contents = $("p#p2").text();	^ var .+ = \$\(•p#p2•\)\.text\(\); $
Insert HTML, including an opening and closing tag and some text, in a div. Make up the div's ID.	$("div#second").html("<p>Have a nice day.</p>");	^ \$\(•div#.+\)\.html\(•<.+>.+<\/.+>•\); $
Read the HTML in a paragraph whose ID is an ID of your choice. Store it in a variable of your choice.	var html6 = $("p#sixth").html();	^ var .+ = \$\(•.+#.+•\)\.html\(\); $
Insert some text of your choice--a text string itself not a variable--into a paragraph whose ID is an ID of your choice.	$("p#intro").text("Hello there.");	^ \$\(•p#.+•\)\.text\(•.+•\); $
5. Drag-and-drop: Holding down the left mouse button, drag the pieces of code onto the screen to insert the text in a paragraph whose ID is "p2" into a paragraph whose ID is "p18".	$("p#p18").text($("p#p2").text());
Read the HTML in a div whose ID is "d3" and store it in the variable contents.	var contents = $("div#d3").html();	var`1spacecontents`1space=`1space$`(`"`div`#`d3`"`)`.`html`(`)`;
Insert the string "wombat" in the form field whose ID is "animal".	$("input#animal").val("wombat");
Read the text in a list item whose ID is "item4" and store it in a variable of your choice.	var contents = $("li#item4").text();	^ var .+ = \$\(•li#item4•\)\.text\(\); $
Insert the text stored in the variable filler in all h3 headings whose class is "whatever".	$("h3.whatever").text(filler);	^ \$\(•h3\.whatever•\)\.text\(filler\); $
Insert HTML of your choice, including an opening and closing tag and some text, in a heading--your choice of heading size and ID.	$("h2#notice").html("<em>Note well</em>");	^ \$\(•h[1-6]#.+•\)\.html\(•<.+>.+<\/.+>•\); $
Insert a string of your choice into a form field whose ID is an ID of your choice.	$("input#name").val("Mark");	^ \$\(•input#.+•\)\.val\(•.+•\); $
Insert text from a form field into a paragraph. Make up the IDs of both the form field and the paragraph.	$("p#id1").text($("input#name").val());	^ \$\(•p#.•\)\.text\(\$\(•input#.•\)\.val\(\)\); $
Insert the string "wombat" in the form field whose ID is "animal".	$("input#animal").val("wombat");	^ \$\(•input#animal•\)\.val\(•wombat•\); $
Read the text in a list item whose ID is "item4" and store it in a variable of your choice.	var contents = $("li#item4").text();	^ var .+ = \$\(•li#item4•\)\.text\(\); $
Insert the text stored in the variable filler in all h3 headings whose class is "whatever".	$("h3.whatever").text(filler);	^ \$\(•h3\.whatever•\)\.text\(filler\); $
Insert HTML of your choice, including an opening and closing tag and some text, in a heading--your choice of heading size and ID.	$("h2#notice").html("<em>Note well</em>");	^ \$\(•h[1-6]#.+•\)\.html\(•<.+>.+<\/.+>•\); $
Insert a string of your choice into a form field whose ID is an ID of your choice.	$("input#name").val("Mark");	^ \$\(•input#.+•\)\.val\(•.+•\); $
Insert text from a form field into a paragraph. Make up the IDs of both the form field and the paragraph.	>$("p#.+").text($("input#.+").val());	^ \$\(•p#.+•\)\.text\(\$\(•input#.+•\)\.val\(\)\); $
http://jsfiddle.net/ASmarterWayToLearn/ou4rwbyw/
http://jsfiddle.net/ASmarterWayToLearn/we8j63tL/