A super useful function for creating elements

README.md

var div = _e('div');

var btn = _e('input', {
  type: 'button',
  value: 'Click Me',
  on: {
    click: function(e) { alert('Hello'); }
  }
});

var users = ['Jane', 'Tim', 'Sarah'];
var ul = _e('ul', {}, users.map(function(user) {
  return _e('li', {}, user);
}));

_e.js

var _e = function (tag, props, content) {
    
    if(arguments.length==2) {
        content = props;
        props = {};
    } else {
        props = props || {};
    }
    
    var el = document.createElement(tag);
    var events;
    
    // Save events
    if(props.on) {
        events = props.on;
        delete props.on;
    }
    
    // Assign properties
    for (var prop in props) {
        if (prop.indexOf('aria-') !== -1 || prop == 'role') {
            el.setAttribute(prop, props[prop]);
        } else {
            el[prop] = props[prop];
        }
    }
    
    // Tack on events
    if(events) {
        for(var event in events) {
            el.addEventListener(event, events[event]);
        }
    }
    
    // Assign content
    if(typeof content == "string") {
        el.innerHTML = content;
    } else {
        el.appendChild(content);
    }
    
    return el;
};

_e.min.js

var _e=function(g,a,d){2==arguments.length?(d=a,a={}):a=a||{};var b=document.createElement(g),e;a.on&&(e=a.on,delete a.on);for(var c in a)-1!==c.indexOf("aria-")||"role"==c?b.setAttribute(c,a[c]):b[c]=a[c];if(e)for(var f in e)b.addEventListener(f,e[f]);"string"==typeof d?b.innerHTML=d:b.appendChild(d);return b};