Creating DIV's in jQuery

Question

The following code works for me:

var div2 = document.createElement('DIV');
$(div2).css('position','relative').insertBefore( $(div).children()[0] );
var div3 = document.createElement("DIV");
$(div2).prepend($(div3).css({'display':'inline','position':'absolute'}));

...but I got to imagine there is a neater jQuery way to do the createElement's. I tried the following, but it didn't work:

$('<div></div>').css('position','relative').insertBefore( $(div).children()[0] );
$(div2).prepend($('<div></div>').css({'display':'inline','position':'absolute'}));

Any sugestions?

Possible duplicate of [jQuery document.createElement equivalent?](http://stackoverflow.com/questions/268490/jquery-document-createelement-equivalent) There are several other questions that answer this as well. — justisb, Dec 10 '13 at 21:17

score 0 · Answer 1 · answered Dec 10 '13 at 21:23

You can use the $("<div></div>") syntax to create elements without using document.createElement('div');

var d = $("<div></div>").text("hello");
$("body").append(d);

This works perfectly, (please check on fiddle http://jsfiddle.net/P5A8L/1/ ) your error may come from the undefined variables div and div2

score 0 · Answer 2 · answered Dec 10 '13 at 21:52

$('body').append('<div>This is my div.</div>').css({'display':'inline','position':'absolute'});

You can feel free to replace 'body' with any selector you want, or the method to prepend, after, before. They should all work. Just a simple one liner. No need to create variables. At least if I understand your question correctly.

Creating DIV's in jQuery

2 Answers2