DOM Utility Helper

by nevkatz

HTML

<div id="root">

</div>

JavaScript

let dom_utils = {};
dom_utils.el = function(o) {
  let el = document.createElement(o.type);
  el.id = o.id;
  el.className = o.className;
  el.innerHTML = o.innerHTML;
  if (el.attrs) {
    Object.keys(el.attrs).forEach(function(key) {
       el.setAttribute(key, el.attrs[key]);
    });
  }
  return el;
}

let label = dom_utils.el({           
  type:'label',
  id: 'label-1',
  className:'neat-label',
  innerHTML:'Readable Text',
  attrs: {
    'data-theme':'emerald'
  }
}); 

let root = document.getElementById('root');

root.appendChild(label);