Position an element in certain place in DOM JavaScript

Question

I have this code which creates an element but the problem i am facing is it appends it at the very bottom of the page, in order for this to work i need it to be positioned in a certain place in the DOM how can i do this ?

var x  = document.getElementById('options_10528_1');
var pos = document.getElementById('options-10528-list');
x.onclick = function(){
var elem = document.createElement('div');
elem.setAttribute("class","uk-warning");
elem.innerHTML = "Unfortunately, we cannot supply this medicine. Please  consult your GP.";
document.body.appendChild(elem);
}

I know what it's contained in so do i just append it to that ye ? — Jacob Kenyon, Sep 06 '16 at 09:48
To position added element as child check this: http://stackoverflow.com/questions/5882768/how-to-append-a-childnode-to-a-specific-position — IT Man, Sep 06 '16 at 09:50

score 0 · Answer 1 · answered Sep 06 '16 at 09:47

0

afterWhichNode.parentNode.insertBefore(newNode, afterWhichNode.nextSibling);

This code will insert a node after the afterwichNode, thats using vanilla javascript, if you are using jquery, just use .after()

answered Sep 06 '16 at 09:47

Ernesto Mayoral Cabezas

727
5
7

score 0 · Answer 2 · answered Sep 06 '16 at 09:49

0

Currently you are appending the element in the body tag, it will always goes at bottom. So if you want to append the element in a specific position, you have to append it in that container. let say you want to append it in "pos", you can do this:

pos.appendChild(elem);

answered Sep 06 '16 at 09:49

BIlal Khan

453
3
16

Thank you it works, i did this before but i still kept the document in it so it was document.pos.appendChild. – Jacob Kenyon Sep 06 '16 at 09:53

Position an element in certain place in DOM JavaScript

2 Answers2