JSFiddle - React, Tailwind, and code Playground

by Darby Rathbone

HTML

<something id="something">
    <child>
        <secondarychild>
            <third>
                
            </third>
        </secondarychild>
    </child>
    
    <child>
        <secondarychild>
            <third>
                
            </third>
        </secondarychild>
    </child>
    
    <child>
        <secondarychild>
            <third>
                
            </third>
        </secondarychild>
    </child>
    
    <child>
        <secondarychild>
            <third>
                
            </third>
        </secondarychild>
    </child>
    
    <child>
        <secondarychild>
            <third>
                
            </third>
        </secondarychild>
    </child>
</something>

JavaScript

Array.prototype.map.call(document.getElementById("something"), (function checker(e) {

    if (typeof e == "object" && e) {
        this.children = [];
        if (Object.keys(e)) {
            this.children = this.children.concat(Array.prototype.map.apply(getElements(e, Object.keys(e)), getElements));
        }
        return this.children;
/*        if (Object.getOwnPropertyNames(e)) {
            children = children.concat(Array.prototype.map.call(getElements(e, Object.getOwnPropertyNames(e)), checker));
            return children;
        }
*/    }

    return e;
})).forEach(function (b) {
    document.body.appendChild(document.createTextNode(b));
});

function getElements(from, id) {
    if (isNumber(id)){
        var id = from;
        from = this;
    }
    if (Array.isArray(id)) return Array.prototype.map.call(id, function (d) {
        return from[d];
    });
    else return from[id];
}

function isNumber(n) {
  return !isNaN(parseFloat(n)) && isFinite(n);
}