关于js修改颜色的的问题

初学js不太懂，js如何在不允许id查找的情况下修改不同的字体颜色

【温馨提示：若能帮到您，望给个采纳该答案哦，谢谢！】
1、效果如下

2、代码如下

<style type="text/css">
    input { color: red; }
</style>

<input type="button" class="button" value="yes" />
<br>
<input type="button" class="button" value="no">
<br>
<input type="button" class="button" value="cancel">
<br>


<script type="text/javascript">

    //获取命名为class="button"的标签
    var allElements = document.getElementsByClassName('button');
    //循环给标签绑定点击事件
    for (var i = 0; i < allElements.length; i++) {
        var el = allElements[i];
        el.onclick = function () {

            //this=指的是，当前点击按钮的这个元素
            this.style.backgroundColor = "blue";
            this.style.fontSize = "20";
        }
    }
</script>

用class或者标签名称也可以的

document.getElementsByTagName('button')用这个获取元素

你在标签上加一个类名
html

css
.xxx{
color:red
}

form>input:nth-child(1){
color:red
}
form>input:nth-child(2){
color:red
}
form>input:nth-child(3){
color:red
}

动态class，不同的颜色样式取一个类名，然后再标签中使用 :class="i==0?'red':'green'"