JSFiddle - React, Tailwind, and code Playground

by gabs00

HTML

<div class = 'a'>
    <div class = 'b'>
        <ul class = 'a'>
            <li class = 'b a'><span class = 'b'>A</span></li>
            <li class = 'a'><span class = 'b'>B</span></li>
            <li class = 'b'><span class = 'a'>C</span></li>
        </ul></div
</div>

JavaScript

console.log(getElementsByClassName('a'));


function getElementsByClassName(names, parent){
    var nodeList = new HTMLCollection();
    var class_names = names.split(' ');
    
    if(!parent){
       parent = document.body;   
    }
    check_element(parent);
    return nodeList;
}
function check_element(element){
    if(check_class(element)){
        Array.prototype.push.call(nodeList, element);
    }
    if(element.childElementCount > 0){
        var iter = iterate_children(element.children);
        var elem;
        while(elem = iter()){
            check_element(elem);            
        }
    }
}
function check_class(element){
    for(var i = 0; i < class_names.length; i++){
        if(!element.classlist.contains(class_names[i]))
            return false;
    }
    return true;
}

function iterate_children(children){
    return function(){
        return Array.prototype.shift.call(children);   
    }        
}