append pure javascript

by Adi Jaya

HTML

<div id="demo">Hello</div>
<hr>
<textarea id="test-output" cols="40" rows="8"></textarea>

JavaScript

Element.prototype.appendEL = function( str, callback ){
    if ( str === undefined ) return;
    var div = document.createElement('div');
    div.innerHTML = str;
    while ( div.childNodes.length > 0 ) {
       this.appendChild( div.childNodes[0] );
    }
    if( typeof callback === "function" ) callback();
}


//===============================test demo
var $ = function( id ){
	return document.getElementById( id );
}

//without callback
$( "demo" ).appendEL( "<p><button>BUTTON</button></p>" );

//with callback
var myhtml = "Lorem <h2>Ipsum</h2> dolor <p>Sit amet</p>";
$( "demo" ).appendEL( myhtml, function(){
    $( "test-output" ).value = $( "demo" ).innerHTML;
});