Javascript 设置属性'；背景色'；未定义的颜色

我需要使用custList中的class=“side1”，因为这是多维数据集的一侧，每次经过特定时间后，我都希望闪烁不同的颜色。我发现它有效的唯一方法是使用setInterval，但我不希望它每隔这么多秒就改变颜色。如果立方体在那里放置5分钟，它将从绿色变为黄色，如果它在那里放置7分钟，它将变为红色，并保持红色，直到它完成，然后消失。我能做些什么使它工作

<div id="loader"></div>
<div style="display: none;" id="myDiv" class="animate-bottom">
    <%--The routing cube--%>
    <div id="wrapD3Cube" class="normal"></div>
</div>

var custList = "";
        var top = 0;
        var left = 0;
        for (var i = 0; i < Data.length; i++) {

            custList += '<div class="D3Cube" id="D3Cube"' + i + '>';
            custList += '<div class="side1" id="side1' + i + '" 
style="position:absolute;  opacity: 1.05;  width: 112px; height: 112px;"> 
</div > ';. 

var changeColor = 0
    function colors()  {

        if (changeColor < 4000) {
            document.getElementsByClassName("side1").style.backgroundColor 
 = '#91CB8A';


        }
        else if (changeColor >= 5000) {
            document.getElementsByClassName("side1").style.backgroundColor 
= '#F7B448';


        }
        else if (changeColor >= 6000) {
            document.getElementsByClassName("side1").style.backgroundColor 
= '#E84F60';

        }

    }
    colors();

var custList=“”；
var-top=0；
左向量=0；
对于（变量i=0；i=5000）{
document.getElementsByClassName（“side1”）.style.backgroundColor
='#F7B448'；
}
否则如果（更改颜色>=6000）{
document.getElementsByClassName（“side1”）.style.backgroundColor
='#E84F60'；
}
}
颜色（）；

函数

document.getElementsByCassName

返回一个

HTMLCollection

，因此您必须选择一个元素：

document.getElementsByClassName("side1")[0].style.backgroundColor = "color";

---

@SebastianSimon的可能重复项它必须是GetElementsByCassName，因为框的id=side1，并且它是多个框的diff side#。因此将其更改为getElementsById没有帮助。链接问题中有10个答案。其中大多数答案告诉您如何处理

HTMLCollection

s和

NodeList

s。@SebastianSimon th但是没有帮助。那么你的问题目前无法回答。提供更多的上下文。做一个。看。如果这十个答案都没有帮助，那么你显然做了一些你没有告诉我们的错误。