Javascript 每个html行或列中的文本颜色要逐个更改

我需要一个帮助，让数字从10到21改变字体颜色为白色一个接一个，并继续循环。比如当我们在电梯里时，当电梯到达那个楼层时，它会保持在发光的楼层编号中

.grid{
最大宽度：var（--包装器）；
显示：网格；
网格模板列：重复（var（--noOfColumns），1fr）；
网格自动流动：稠密；
/*如果内容较高，则长方体将增长到适合的高度。只有当列值为1fr时，这才起作用*/
栅格自动行：var（--rh）；
网格行间距：var（--边沟）；
保证金：var（-）；
背景色：#555e65；
}

10
14
18
17
18
19
20
21

.grid{
最大宽度：var（--包装器）；
显示：网格；
网格模板列：重复（var（--noOfColumns），1fr）；
网格自动流动：稠密；
/*如果内容较高，则长方体将增长到适合的高度。只有当列值为1fr时，这才起作用*/
栅格自动行：var（--rh）；
网格行间距：var（--边沟）；
保证金：var（-）；
背景色：#555e65；
}
@关键帧改变颜色{
来自{color:red}
至{颜色：红色}；
}
.制作动画{
颜色：蓝色；
过渡：颜色。3s轻松；
动画：变色10s；
}
.设置动画：第n个子对象（1）{
动画延迟：.01s；
}
.动画：第n个孩子（2）{
动画延迟：10秒；
}
.动画：第n个孩子（3）{
动画延迟：20秒；
}
.动画：第n个孩子（4）{
动画延迟：30秒；
}
.动画：第n个孩子（5）{
动画延迟：40秒；
}
.动画：第n个孩子（6）{
动画延迟：50秒；
}
.动画：第n个孩子（7）{
动画延迟：60秒；
}
.动画：第n个孩子（8）{
动画延迟：70秒；
}
.动画：第n个孩子（9）{
动画延迟：80秒；
}

10
14
18
17
18
19
20
21

我不太明白你的问题。您是否只想一次性更改号码的颜色？或者你想改变第一个数字，等一秒钟再改变下一个，依此类推？用更一般的方式问你的问题。所以它出现在更多的谷歌搜索中。然后我想回答你对所有开发人员的不满，对不起，是的，我想等每10秒之后，下一个数字颜色改变成白色顺序，以前的数字颜色变回原来的颜色，请考虑添加一些解释，以更好地理解你的代码！我可以增加字体大小和颜色，并使它再次开始，一旦它达到最后一个数字