JavaScript: empty a DOM element

by gabrieleromanato

HTML

<button id="empty">Empty</button>

<div id="test">
    <h1>Test</h1>
    <p>Test</p>
    <ul>
        <li>Test</li>
        <li>Test</li>
        <li>Test</li>
    </ul>
</div>

JavaScript

HTMLElement.prototype.empty = function() {
    var that = this;
    while (that.hasChildNodes()) {
        that.removeChild(that.lastChild);
    }
};

var empty = document.getElementById('empty'),
    test = document.getElementById('test');

empty.onclick = function() {
    test.empty();
}