outerHTML for almost every browser ... if you need it ...

We all have to deal with memory leaks problem and apparently a good way to be sure that an HTMLElement has been removed from its "flow" is the outerHTML assignemnt (thanks Ariel for the suggestion)

element.outerHTML = "";
element = null;

If the element is not a document.body or another body parent node, Internet Explorer will "extract" that element from its context, if any, and if there are no other references for that element the null assignment will, theoretically, complete the opera, hopefully solving memory leaks problem for that node as well ...

To remove ... but to replace too ...

Every library has a "swap" or replace method to quickly change an element, but even if we all know that innerHTML is the fastest way to insert content, few libraries use outerHTML to replace nodes, that as far as I know, should be "that fast" in IE as innerHTML is:

// traditional swap, the DOM way
function swap(oldNode, newNode){
    var parentNode = oldNode.parentNode;
    parentNode.insertBefore(newNode, oldNode);
    parentNode.removeChild(oldNode);
};

// spaghetti swap, the outerHTML way 
function swap(oldNode, newNode){
    oldNode.outerHTML = newNode.outerHTML;
};

outerHTML ... both get and set

try{
HTMLElement.prototype.__defineGetter__.length;
(function(body, removeChild){
    HTMLElement.prototype.__defineGetter__(
        "outerHTML",
        function(){
            var self = body.appendChild(this.cloneNode(true)),
                outerHTML = body.innerHTML;
            body.removeChild(self);
            return outerHTML;
        }
    );
    HTMLElement.prototype.__defineSetter__(
        "outerHTML",
        function(String){
            if(!String)
                removeChild(this);
            else if(this.parentNode){
                body.innerHTML = String;
                while(body.firstChild)
                    this.parentNode.insertBefore(body.firstChild, this);
                removeChild(this);
                body.innerHTML = "";
            };
        }
    );
})(
    document.createElement("body"),
    function(HTMLElement){if(HTMLElement.parentNode)HTMLElement.parentNode.removeChild(HTMLElement);}
);
}catch(e){};

Conclusion

pro and cons are the same of innerHTML and the reference is lost as is for Internet Explorer, whenever we decide to use this dirty approach to remove or change elements in the DOM. A last example?

function change(strong){
    strong.outerHTML = "not strong anymore";
    strong = null;
};
onload = function(){
    document.body.innerHTML = "click";
};