this is minimal js, everything else is commented. I cannot understand why "cards[i]"(first one in the for loop) has a red squiggly line under it, I cannot run any console commands. Please help!
let cards=document.querySelectorAll(".blocks");
let pic,card,rand;
let finals = [];
const count = 10;
const max = 9;
for(let k = 0; k < 1000; k++){
rand = Math.round(Math.random() * max);
// !finals.includes(rand) && finals.push(rand)
if(!finals.includes(rand))
finals.push(rand);
}
finals = finals.slice(0, count)
setupCards(finals);
function setupCards(arr){
for(let i=0;i<=arr.length;i++){
====>cards[i].style.backgroundImage=`url(images/${arr[i]}.jpg)`;
// cards[i].style.transform="rotateY(180deg)";
// cards[i].style.backgroundImage="url(images/back6.jpg)";
}
}
In this condition test:
for(let i=0;i<=arr.length;i++){
you are letting the i go from zero (which is the index of the first element) to the length of the array (which gets you to the last plus 1 element - which doesn't exist).
Try:
for(let i=0;i<arr.length;i++){