/**
 * Create a DOM element from a CSS query
 * ex: createElement('span#my-id.my-class.second-class');
 */
function createElement(querySelector) {
  if (!querySelector) {
    querySelector = 'div';
  }
  let nodeType = querySelector.match(/^[a-z]+/i);
  let id = querySelector.match(/#([a-z]+[a-z0-9-]*)/gi);
  let classes = querySelector.match(/\.([a-z]+[a-z0-9-]*)/gi);
  let node = (nodeType) ? nodeType[0] : 'div';

  if (id && id.length > 1) {
    throw error('only 1 ID is allowed');
  }

  const elt = document.createElement(node);

  if (id) {
    elt.id = id[0].replace('#', '');
  }

  if (classes) {
    elt.classList.value = classes.join(' ').replace(/\./g, '');
  }

  return elt;
}