Javascript 如何基于div颜色序列jQuery显示按钮

我正试图在一个网站上建立一个“复活节彩蛋”类型的页面，在那里，人们可以点击彩色方块，在一系列颜色中循环。有8个方块，我想使用jQuery在所有方块的颜色顺序正确的情况下显示一个按钮。我有以下用于颜色循环的设置，但我对jQuery是新手，不知道如何检查正确的颜色序列。我在Rails 5工作

var backgrounds=[“红色”、“绿色”、“黄色”、“橙色”、“紫色”、“紫色”，
“粉色”、“钢蓝色”、“蓝色”]；
函数setColor（el）{
el.colorIdx=el.colorIdx | | 0；
el.style.backgroundColor=背景[el.colorIdx++%backgrounds.length]；
}
var buttonMessage=“成功”；
功能臀部（）{
if（$（'#div1'）.css（'background-color'）=='rgb（255，255，255'））{
按钮消息；
}否则{
按钮消息=“失败”；
}
document.getElementById（“test”）.innerHTML=按钮消息；
}

div.colored{
背景：蓝色；
高度：100px；
宽度：100px；
利润率：10px；
浮动：中心；
}

点击这里

其中一个解决方案，您可以使用

nth-child（）对其进行循环

这将有助于您我仍然不明白您是否希望按钮仅在所有正方形都具有相同颜色时才显示。对吗？我希望按钮在每个正方形都具有特定颜色时显示，但并非所有正方形都具有相同的颜色。例如：Sq1:蓝色、Sq2:红色、Sq3:蓝色、Sq4:黄色等…颜色是如何设置的？随机，在cl上单击？颜色顺序是背景的顺序数组？所有颜色都以蓝色开始，并在单击时循环