JSFiddle - React, Tailwind, and code Playground

HTML

<div class="A">alpha1</div>
<div class="B">alpha2</div>
<div class="A">alpha3</div>
<div class="A">alpha4</div>
<div class="A">alpha5</div>
<div class="B">alpha6</div>
<div class="A">alpha7</div>

JavaScript

function applyStyleToFirstDiv(className, styleAttr, val,baseSelector) {
    if(baseSelector == null){
        baseSelector = document    
    }
    var divElements = baseSelector.getElementsByTagName("div"),
        len = divElements.length;
    var prevWas = false,currentIs;
    for (var i = 0; i < len; i++) {
        var cur = divElements[i];
        var classes = cur.className.split(" ");
        currentIs = false;
        for (var j = 0; j < classes.length; j++) {
            if (classes[j] === className) {
                currentIs = true;
                break;
            }
        }
        if(currentIs && !prevWas){
            cur.style[styleAttr] = val;    
        }
        prevWas = currentIs;
        
    }
}

applyStyleToFirstDiv("A","color","yellow");