JDev

Here are some handy examples from SlayerOffice that demonstrate how to manipulate and reference DOM Elements: 

1 .Remove a DOM Element  :

    oElement.parentNode.removeChild(oElement);

2. Replace a child element with a new one:

  var newElement = document.createElement("p");
  oldElement.parentNode.replaceChild(newElement, oldElement); 

 3. Remove text from an element:

    var oElement = document.getElementById(obj.id);
    while(oElement.firstChild)
        oElement.removeChild(oElement.firstChild);

 4. Use a DocumentFragment object to speed up loop constructs:

    var oFragment = document.createDocumentFragment();
   var i = 1000;
   while(i–>0) {
     var oElement = document.createElement("div");
     oFragment.appendChild(oElement);
   }
   bodyElement.appendChild(oFragment);

5. Use cloneNode to clear innerHTML:

    var oElement = document.getElementById("myElement");                       
    oElement.parentNode.replaceChild(oElement.cloneNode(false),oElement);

6. Insert an element before the specified element:

    var oldElement = document.getElementById("myElement");
    var newElement =     document.createElement("span");    
    oldElement.parentNode.insertBefore(newElement , oldElement);

7. Insert an element after the specified element:

    var oldElement = document.getElementById("myElement");
    var newElement = document.createElement("span");
    oldElement.parentNode.insertBefore(newElement,oldElement.nextSibling);

8. Get the text value of an element:
     var text = oElement.firstChild.nodeValue;   

9.Get a reference to the next element among the children: 
     var oNode1 = document.getElementById("myDiv").firstChild.nextSibling;

10. Get a reference to the previous element:
   var oNode2 = document.getElementById("myDiv").lastChild.previousSibling;

More techniques:

Insert an element at the top of a page:

var oElement = document.createElement("div"); 
var bodyRef = document.getElementsByTagName("body").item(0);
bodyRef.insertBefore(oElement, document.body.firstChild);