jQuery prepend() method

jQuery HTML/CSS Methods

The prepend() method inserts the specified content at the beginning of each selected element (as the first child element).

To insert content at the end of the selected element, useappend()Method.

Syntax:

Insert prefix content:

$.selector.prepend(content)

Using a function to add content:

$.selector.prepend(function(index, html))

Example

Add some text content before all paragraphs:

$("button").click(function(){
　　$("p").prepend("Hello world");
});

Add some HTML before all paragraphs:

$("button").click(function(){
　　$("p").prepend("<b>Hello world</b>
});

This example uses document.createTextNode() to create a text node and add it before all <p> elements:

$("button").click(function(){
　　$("p").prepend(document.createTextNode("Hello world"));
});

Using a function to add content:

$("button").click(function(){
　　$("p").prepend(function(i){
return "<b>This p element has index "　+　i　+　"</b>";
　　});
});

Parameter values

jQuery HTML/CSS Methods