Comments for Javascript DOM insertAfter function

This won't work of course if the element you're trying to insert after is the last element in the reference element's parent. Besides, this is hilariously trite, poor javascript (just Google 'javascript insertAfter' to get a grasp of the uninformed horror). Try checking whether the reference element is equal to the parent's last child and appending the new element if so, doing what everybody else seems to strain themselves doing only otherwise.

I just tried it in IE7 and FF2 - worked like a charm!

I just tried this to add tags to the very bottom of documents in both IE7 and FF2 - worked like a charm!!
Thanks very much

Worst Case Scenario: If you're afraid that insertBefore won't work, just make the additional mods:

// This function inserts newNode after referenceNode
function insertAfter( referenceNode, newNode )
{
    if (referenceNode.nextSibling) {
        referenceNode.parentNode.insertBefore( newNode, referenceNode.nextSibling );
    }
    else {
        referenceNode.parentNode.appendChild( newNode);
    }
}

Theres no wcs here. I was trying the code a while ago and managed to fire an error on IE. The problem happens when the referenceNode.nextSibbling is undefined.

In the original example there was a text node (the line change in the code) that was acting as a nextSibbling for the supoussed to be last element. When deleting the line change IE7 stopped working because the node.insertBefore functions does not expect a undefined value as second parameter.

So for IE to work is necesary to map the undefined value to null.

Now without further ado... the function... this is working well for me.

var undefined;
function insertAfter (node, newNode){
var parent = node.parentNode;
var next = node.nextSibbling;
//following: the IE fix
if (next==undefined) next=null;
parent.insertBefore(newNode,next);
}

Nutria, it is working for me in IE. I noticed you spelled Sibling with 2 B's. Maybe that is why it was coming up as "undefined".

Anyway, this solution was great, saved my coding project from turning into something ugly. Very elegant and simple--awesomeness.

Works, unless the element is the last child, i.e. <td><hr /></td>. You should add a condition that checks if it is the last child, and if it is, simply use appendChild();

function insertAfter(newElem,elem)
{
if(elem.nextSibling) elem.parentNode.appendChild(newElem);
else elem.parentNode.insertBefore(newElem,elem.nextsibling);