如何在一个元素的多个类中追加一个特定的类？

Question

我正在尝试创建一个游戏，以便在页面加载或赢得游戏时，四个颜色按钮一个接一个点亮，然后停止（不再点亮）。我用作按钮的elements（divs）已经有多个类，包括一个动态附加的禁用类，以防止加载时按下按钮。每个元素索引[2]中的第3类包含颜色类，例如红色，绿色等。我希望将“ -light”类附加到这些类上，因为我在CSS中的“ red-light”类包含使元素“点亮”的代码，然后过一分钟左右，我希望该类具有附加功能（ -light）再次删除？

当玩家点击按钮时，我可以通过以下代码添加点击功能事件监听器来实现此目的：

color = $(this).attr("class").split(" ")[2];

然后将其传递给一个函数，该函数添加和删除这样的适当类：

$("#"+id).addClass(color + "-light");               
setTimeout(function() {
    $("#"+id).removeClass(color + "-light");
}, 500);

但是，我无法终生想出如何仅在页面加载时或用户获胜时执行此操作？

我尝试过此操作，以便随后可以创建一个循环来添加和删除颜色类，但是它不起作用：

const redBtn = $(".red").attr("class").split(" ")[2];

我确实做了一些类似的事情来添加和删除我粘贴在下面的按钮的禁用类...

function removeDisable() {
 colorBtns.forEach(function (button) {
  button.classList.remove("btn-disabled");
  // console.log(colorBtns);
 });
}