Shorthand to create an HTML element in Vanilla JS using selector syntax for tag, id, and classes.

tag.js

function tag(selector, attrs, innerText = '') {

    let _tag = selector.match(/^(\w[\w-_\d]*)/)?.[1];
    let _id = selector.match(/#([\w_]+[\w-_\d]*)/)?.[1];
    let _classes = Array.from(selector.matchAll(/\.([\w_]+[\w-_\d]*)/g)).map(m => m?.[1]);

    let el = document.createElement(_tag ?? 'div');

    if (_id) {
        el.setAttribute('id', _id);
    }

    if (_classes) {
        el.classList.add(..._classes);
    }

    if (attrs) {
        for (let [attr, value] of Object.entries(attrs)) {
            el.setAttribute(attr, value);
        }
    }
    el.innerText = innerText;
    return el;
}