jQuery .prependTo() inserts every element in the set of matched elements at the beginning of the target.

Syntax and Description

.prependTo(target)

Insert every element in the set of matched elements at the beginning of the target. target is a selector, element, HTML string, or jQuery object; the matched set of elements will be inserted at the beginning of the selected element(s). Its return value is the jQuery object, for chaining purposes.

Consider the following HTML code:


<h2>Header</h2>/* w  w  w  . j a  v  a2 s .c o m*/
<div class="container">
 <div class="inner">Hello</div>
 <div class="inner">InnerText</div>
</div>

We can create content and insert it into several elements.


$('<p>Test</p>').prependTo('.inner');

The result would be:


<h2>Header</h2>/*  w ww . ja  v  a 2 s  . c o  m*/
<div class="container">
 <div class="inner">
 <p>Test</p>
 Hello
 </div>
 <div class="inner">
 <p>Test</p>
 InnerText
 </div>
</div>

To select an element on the page and insert it into another.

$('h2').prependTo($('.container'));

If an element selected this way is inserted elsewhere, it will be moved into the target not cloned.


<div class="container">
 <h2>Header</h2>//  ww w.j a va 2 s .  c om
 <div class="inner">Hello</div>
 <div class="inner">InnerText</div>
</div>




















Home »
  jQuery »
    jQuery Tutorial »




Basics
Selector
DOM
Event
Effect
Utilities