Question

.prepend() works when there is one line of code such as .prepend("<li>item1<li>") but when I try to put a big block of code in it, such as multiple divs with classes etc, it doesn’t work. I did however, see that you can pass it a function but I can’t figure out the syntax.

If I need to use $(selector).prepend(function(index,html)) instead please help me use this.

Edit: I got it working by passing a function into it, I still don’t understand how to use the index,html parameters.

Answer 1

You should create string…

var myString = '<div class="lorem"><div id="temp" class="ipsum"></div></div>';

and then prepend it:

$(selector).prepend(myString);

Note: Always reduce DOM insertions to a minium. Working solution: http://jsfiddle.net/mCUWe/

EDIT: If you want to format your markup you’re able to do something called string concatenation. Works as well: http://jsfiddle.net/mCUWe/1/

var myString = '<div class="lorem">LOREM'
              +'<div id="temp" class="ipsum">IPSUM'
              +'</div></div>';

Update 02/2017

Nowadays I recommended to go with ES2015 Template-Strings