如何使用vanilla JavaScript在单击时更改动态生成的div的颜色？

我在一个在线训练营，他们要求我创建一个记忆游戏，并提供以下代码。第一步是点击改变卡片的颜色。仅限香草JavaScript

我非常确定我需要选择所有的div，使用一个循环来附加一个事件监听器，使用target属性来切换类值，以便用户可以看到它。问题是，我在循环中遇到了错误

我只需要一个方向，一个提示，或者有用的指针。不是找人告诉我答案，只是被难住了

const gameContainer=document.getElementById（'game'）；
常量颜色=[
“红色”，
“蓝色”，
“绿色”，
“橙色”，
“紫色”，
“红色”，
“蓝色”，
“绿色”，
“橙色”，
“紫色”，
'印度红'，//从列表的下面开始，我添加了这些颜色。
“深蓝色”，
“limegreen”，
"珊瑚",，
“丽贝卡紫”，
“印度红”，
“深蓝色”，
“limegreen”，
"珊瑚",，
“丽贝卡紫色”
];
函数洗牌（数组）{
让计数器=array.length；
而（计数器>0）{
让index=Math.floor（Math.random（）*计数器）；
计数器--；
设温度=阵列[计数器]；
数组[计数器]=数组[索引]；
数组[索引]=温度；
}
返回数组；
}
让shuffledColors=shuffle（颜色）//颜色数组
函数CreateDivisForColors（colorArray）{
for（让颜色数组的颜色）{
const newDiv=document.createElement（'div'）；
newDiv.classList.add（颜色）；
newDiv.addEventListener（'click'，handleCardClick）；
gameContainer.append（newDiv）；
}
}
//TODO:实现这个功能！
功能手柄卡扣（e）{
//可以使用event.target查看单击了哪个元素
//创建一个循环来循环所有div
//访问当前单击的div的类列表//这段代码就是我们编写的
常数curDiv=e.target；
const curDivColor=e.target.className；
const divElement=document.querySelector（'div'）；
for（让divElement的flippedColor）{
常量索引=shuffledColors.length；
索引--；
curDiv.classList.toggle（[i]）；
e、 加法器；
}
}
CreateDivisForColors（混色）
#游戏分区{
边框：1px纯黑；
宽度：15%；
高度：200px；
利润率：10px；
显示：内联块；
边界半径：0.6rem；
}

记忆游戏！
记忆游戏！

我很确定我需要选择所有的div，使用一个循环
附加事件侦听器，使用target属性切换类
值，以便用户可以看到它

我认为没有必要。您只需更改单击的
div
的类或样式即可


const gameContainer=document.getElementById（'game'）；
常量颜色=[
“红色”，
“蓝色”，
“绿色”，
“橙色”，
“紫色”，
“红色”，
“蓝色”，
“绿色”，
“橙色”，
“紫色”，
'印度红'，//从列表的下面开始，我添加了这些颜色。
“深蓝色”，
“limegreen”，
"珊瑚",，
“丽贝卡紫”，
“印度红”，
“深蓝色”，
“limegreen”，
"珊瑚",，
“丽贝卡紫色”
];
函数洗牌（数组）{
让计数器=array.length；
而（计数器>0）{
让index=Math.floor（Math.random（）*计数器）；
计数器--；
设温度=阵列[计数器]；
数组[计数器]=数组[索引]；
数组[索引]=温度；
}
返回数组；
}
让shuffledColors=shuffle（颜色）//颜色数组
函数CreateDivisForColors（colorArray）{
for（让颜色数组的颜色）{
const newDiv=document.createElement（'div'）；
newDiv.classList.add（颜色）；
newDiv.addEventListener（'click'，handleCardClick）；
gameContainer.append（newDiv）；
}
}
//TODO:实现这个功能！
功能手柄卡扣（e）{
//可以使用event.target查看单击了哪个元素
//创建一个循环来循环所有div
//访问当前单击的div的类列表//这段代码就是我们编写的
常数curDiv=e.target；
让shuffledColors=shuffle（颜色）；
curDiv.style.background=shuffledColors[0]
}
CreateDivisForColors（混色）
#游戏分区{
边框：1px纯黑；
宽度：15%；
高度：200px；
利润率：10px；
显示：内联块；
边界半径：0.6rem；
}

记忆游戏！
记忆游戏！

我很确定我需要选择所有的div，使用一个循环
附加事件侦听器，使用target属性切换类
值，以便用户可以看到它

我认为没有必要。您只需更改单击的
div
的类或样式即可


const gameContainer=document.getElementById（'game'）；
常量颜色=[
“红色”，
“蓝色”，
“绿色”，
“橙色”，
“紫色”，
“红色”，
“蓝色”，
“绿色”，
“橙色”，
“紫色”，
'印度红'，//从列表的下面开始，我添加了这些颜色。
“深蓝色”，
“limegreen”，
"珊瑚",，
“丽贝卡紫”，
“印度红”，
“深蓝色”，
“limegreen”，
"珊瑚",，
“丽贝卡紫色”
];
函数洗牌（数组）{
让计数器=array.length；
而（计数器>0）{
让index=Math.floor（Math.random（）*计数器）；
计数器--；
设温度=阵列[计数器]；
数组[计数器]=数组[索引]；
数组[索引]=温度；
}
返回数组；
}
让shuffledColors=shuffle（颜色）//颜色数组
函数CreateDivisForColors（colorArray）{
for（让颜色数组的颜色）{
const newDiv=document.createElement（'div'）；
newDiv.classList.add（颜色）；
newDiv.addEventListener（'click'，handleCardClick）；
gameContainer.append（newDiv）；
}
}
//TODO:实现这个功能！
功能手柄卡扣（e）{
//可以使用event.target查看单击了哪个元素
//创建一个循环来循环所有div
//访问当前单击的div的类列表//这段代码就是我们编写的
常数curDiv=e.target；
让shuffledColors=shuffle（颜色）；