Or, get the raw source.
/** * document.createElement convenience wrapper * * The data parameter is an object that must have the "tag" key, containing * a string with the tagname of the element to create. It can optionally have * a "children" key which can be: a string, "data" object, or an array of "data" * objects to append to this element as children. Any other key is taken as an * attribute to be applied to this tag. * * Available under an MIT license: * http://www.opensource.org/licenses/mit-license.php * * @param {Object} data The data representing the element to create * @return {Element} The element created. */ function $E(data) { var el; if ('string'==typeof data) { el=document.createTextNode(data); } else { //create the element el=document.createElement(data.tag); delete(data.tag); //append the children if ('undefined'!=typeof data.children) { if ('string'==typeof data.children || 'undefined'==typeof data.children.length ) { //strings and single elements el.appendChild($E(data.children)); } else { //arrays of elements for (var i=0, child=null; 'undefined'!=typeof (child=data.children[i]); i++) { el.appendChild($E(child)); } } delete(data.children); } //any other data is attributes for (attr in data) { el[attr]=data[attr]; } } return el; }
var element=$E({
tag:'div',
className:'toolGroup',
id:'toolGroup_1',
children:{
tag:'div',
className:'roundBarTop',
children:[{
tag:'div',
className:'leftEdge'
},{
tag:'div',
className:'rightEdge'
},{
tag:'div',
className:'heading',
children:[{
tag:'a',
className:'collapser'
},
'Group Heading'
]
}]
}
});