function isElement(obj) {
  try {
    // Using W3 DOM2 (works for FF, Opera and Chrome)
    return obj instanceof HTMLElement;
  } catch(e) {
    //Browsers not supporting W3 DOM2 don't have HTMLElement and
    //an exception is thrown and we end up here. Testing some
    //properties that all elements have (works on IE7)
    return (typeof obj==="object") &&
      (obj.nodeType===1) && (typeof obj.style === "object") &&
      (typeof obj.ownerDocument ==="object");
  }
}

function appendCTX(el, ctx){
  if (isElement(ctx)){
    el.appendChild(ctx);
  } else {
    var t = document.createTextNode(ctx.toString());
    el.appendChild(t);
  }
}

export function el(ename, ctx, cls, attr){
  var e = document.createElement(ename);
  if (ctx){
    if (ctx instanceof Array){
      ctx.forEach(item => appendCTX(el, item));
    } else {
      appendCTX(el, ctx);
    }
  }

  if (cls){
    var cl = cls;
    if (typeof(cl) === "String")
      cl = cl.split(" ");
    if (cl instanceof Array){
      cl.forEach(c => el.classList.add(c.trim()));
    }
  }
  if (attr){
    var keys = Object.keys(attr);
    keys.forEach(function(key){
      if (attr.hasOwnProperty(key)){
        var att = document.createAttribute(key.toString());
        if (typeof(attr[key]) === "String"){
          att.value = attr[key];
          el.setAttributeNode(att);
        }
      }
    });
  }
}

export const header = el.bind(null, "header");
export const title = el.bind(null, "title");
export const script = el.bind(null, "script");
export const link = el.bind(null, "link");
export const meta = el.bind(null, "meta");
export const div = el.bind(null, "div");
export const span = el.bind(null, "span");
export const a = el.bind(null, "a");
export const p = el.bind(null, "p");
export const b = el.bind(null, "b");
export const i = el.bind(null, "i");
export const br = el.bind(null, "br");
export const ol = el.bind(null, "ol");
export const ul = el.bind(null, "ul");
export const li = el.bind(null, "li");
export const em = el.bind(null, "em");
export const font = el.bind(null, "font");
export const h1 = el.bind(null, "h1");
export const h2 = el.bind(null, "h2");
export const h3 = el.bind(null, "h3");
export const h4 = el.bind(null, "h4");
export const h5 = el.bind(null, "h5");
export const h6 = el.bind(null, "h6");
export const hr = el.bind(null, "hr");
export const blockquote = el.bind(null, "blockquote");
export const button = el.bind(null, "button");
export const nav = el.bind(null, "nav");
export const canvas = el.bind(null, "canvas");
export const caption = el.bind(null, "caption");