Juqery Learning 5 Document Processing Insertion_jquery

append(content)
Append content to each matching element.
This operation is similar to executing the appendChild method on specified elements to add them to the document.
-------------------------------------------------- ----------------------------------
Append content to the inside of every matched element.
This operation is similar to doing an appendChild to all the specified elements, adding them into the document.
Return value
jQuery
Parameters
content (String, Element, jQuery): C to be appended to the target The content
example
appends some HTML tags to all paragraphs.
HTML code:

I would like to say:

jQuery code:
$("p").append("Hello");
Result:
[

I would like to say: Hello

]
-
------------- -------------------------------------------------- -------------------------------------------------- --------------------------------
appendTo(content)
Append all Matching elements are appended to another, specified set of elements.
In fact, using this method reverses the conventional $(A).append(B) operation, that is, instead of appending B to A, A is appended to B.
-------------------------------------------------- ----------------------------------
Append all of the matched elements to another, specified, set of elements .
This operation is, essentially, the reverse of doing a regular $(A).append(B), in that instead of appending B to A, you're appending A to B.
Return Value
jQuery
Parameter
content (String): used for appended content
Example
Append all paragraphs to the element with ID value foo.
HTML code:

I would like to say:

jQuery code:
$("p").appendTo("#foo") ;
Result:

-------------------------- -------------------------------------------------- -------------------------------------------------- --------------------------
prepend(content)
Prepend content inside each matching element.
This is the best way to insert content at the beginning of all matching elements.
-------------------------------------------------- ----------------------------------
Prepend content to the inside of every matched element.
This operation is the best way to insert elements inside, at the beginning, of all matched elements.
Return value
jQuery
Parameters
content (String, Element, jQuery): To be inserted into the target element Front-end content
Example
Prepend some HTML markup code to all paragraphs.
HTML code:

I would like to say:

jQuery code:
$("p").prepend("Hello");
Result:
[ Hello

I would like to say:

]
------------------ -------------------------------------------------- ------------
Place a DOM element before all paragraphs
HTML code:

I would like to say:

I would like to say:

Hello
Good Bye
jQuery code:
$("p").prepend( $ (".foo")[0] );
Result:

HelloI would like to say:

HelloI would like to say:

Hello
Good Bye
---------------- -------------------------------------------------- ----------------
Prepend a jQuery object (similar to an array of DOM elements) to all paragraphs.
HTML code:

I would like to say:

Hello
jQuery code:
$("p").prepend( $("b ") );
Result:

HelloI would like to say:

---------------- -------------------------------------------------- -------------------------------------------------- -------------------------------
prependTo(content)
Prepend all matching elements to another , in the specified element element collection.
In fact, using this method reverses the conventional $(A).prepend(B) operation, that is, instead of prepending B to A, A is prepended to B.
-------------------------------------------------- ----------------------------------
Prepend all of the matched elements to another, specified, set of elements .
This operation is, essentially, the reverse of doing a regular $(A).prepend(B), in that instead of prepending B to A, you're prepending A to B.
Return Value
jQuery
Parameters
content (String): jQuery expression used to match elements
Example
Append all paragraphs to the element with ID value foo.
HTML code:

I would like to say:

jQuery code:
$("p").prependTo("#foo") ;
Result:

-------------------------------------------------- -------------------------------------------------- --------------------------------------------------
after(content)
Insert content after each matching element.
-------------------------------------------------- ----------------------------------
Insert content after each of the matched elements.
Return value
jQuery
Parameters
content (String, Element, jQuery): Content inserted after each target
Example
Insert some HTML markup code after all paragraphs.
HTML code:

I would like to say:

jQuery code:
$("p").after("Hello");
Result:

I would like to say:

Hello
-------------------------- -------------------------------------------------- ----------
Insert a DOM element after all paragraphs.
HTML code:
Hello

I would like to say:

jQuery code:
$("p").after( $("# foo")[0] );
Result:

I would like to say:

Hello
------------ -------------------------------------------------- ------------------
Insert a jQuery object (similar to an array of DOM elements) after all paragraphs.
HTML code:
Hello

I would like to say:

jQuery code:
$("p").after( $("b ") );
Result:

I would like to say:

Hello
---------------- -------------------------------------------------- -------------------------------------------------- -----------------------------
before(content)
Insert content before each matching element.
-------------------------------------------------- ----------------------------------
Insert content before each of the matched elements.
Return value
jQuery
Parameters
content (String, Element, jQuery): Content inserted before each target
Example
Insert some HTML markup code before all paragraphs.
HTML code:

I would like to say:

jQuery code:
$("p").before("Hello");
Result:
[ Hello

I would like to say:

]
------------------ -------------------------------------------------- ------------
Insert an element before all paragraphs.
HTML code:

I would like to say:

Hello
jQuery code:
$("p").before( $("# foo")[0] );
Result:
Hello

I would like to say:

------------ -------------------------------------------------- ------------------
Insert a jQuery object (similar to an array of DOM elements) before all paragraphs.
HTML code:

I would like to say:

Hello
jQuery code:
$("p").before( $("b ") );
Result:
Hello

I would like to say:

---------------- -------------------------------------------------- -------------------------------------------------- -----------------------------
insertAfter(content)
Insert all matching elements into another, The specified element follows the set of elements.
In fact, using this method reverses the conventional $(A).after(B) operation, that is, instead of inserting B after A, A is inserted after B.
-------------------------------------------------- ----------------------------------
Insert all of the matched elements after another, specified, set of elements .
This operation is, essentially, the reverse of doing a regular $(A).after(B), in that instead of inserting B after A, you're inserting A after B.
Return Value
jQuery
Parameters
content (String): jQuery expression for matching elements
Example
Insert an element after all paragraphs. Same as $("#foo").after("p")
HTML code:

I would like to say:

jQuery code:
$("p").insertAfter("#foo");
Result:

I would like to say:

-- -------------------------------------------------- -------------------------------------------------- ---------------------------------------------
insertBefore(content)
Insert all matching elements in front of another, specified set of elements.
In fact, using this method reverses the conventional $(A).before(B) operation, that is, instead of inserting B before A, A is inserted before B.
-------------------------------------------------- ----------------------------------
Insert all of the matched elements before another, specified, set of elements .
This operation is, essentially, the reverse of doing a regular $(A).before(B), in that instead of inserting B before A, you're inserting A before B.
Return Value
jQuery
Parameters
content (String): jQuery expression for matching elements
Example
Insert an element before all paragraphs. Same as $("#foo").before("p").
HTML code:

I would like to say:

jQuery code:
$("p").insertBefore("#foo" );
Result:

I would like to say: