Element#insert(content) → Element

• content (String | Element | Object) – The content to insert.

Inserts content above, below, at the top, and/or at the bottom of the given element, depending on the option(s) given.

insert accepts content in any of these forms:

• String: A string of HTML to be parsed and rendered
• Element: An Element instance to insert
• ...any object with a toElement method: The method is called and the resulting element used
• ...any object with a toHTML method: The method is called and the resulting HTML string is parsed and rendered

The content argument can be the content to insert, in which case the implied insertion point is bottom, or an object that specifies one or more insertion points (e.g., { bottom: "foo", top: "bar" }).

Accepted insertion points are:

• before (as element's previous sibling)
• after (as element's next sibling)
• top (as element's first child)
• bottom (as element's last child)

Note that if the inserted HTML contains any <script> tag, these will be automatically evaluated after the insertion (insert internally calls String.evalScripts when inserting HTML).

Examples

Insert the given HTML at the bottom of the element (using the default):

$('myelement').insert("<p>HTML to append</p>");
 $('myelement').insert({
  top: new Element('img', {src: 'logo.png'})
});

Put hrs before and after the element:

$('myelement').insert({
  before: "<hr>",
  after: "<hr>"
});

This method can be called either as an instance method or as a generic method. If calling as a generic, pass the instance in as the first argument.