Having trouble consoling the which element's color matches....HELP

1

Here is a description of my problem and I will be following it with a link to my codePen…

I have 4 circles, 3 of them are one color, and 1 is a different color. I want to identify the circle with the 1 color that is different from the others using a function that gets called when a button is pressed. When I click the button I want to console.log this circle.

Currently I have it set up trying to return the index of the array (will make more sense when you look at it). But i cant get that to work. What is wrong here?

2

JavaScript is case-sensitive. Look at your browser’s console. There is an error showing that you need to resolve first.

Once you resolve that, then you could use the following inside the for loop to check the fill value. You must use getComputedStyle, because the styling is accomplished via CSS.

    const { fill } = window.getComputedStyle(picsArr[i]);
    if (fill === "rgb(76, 255, 92)") {
      console.log(i);
    }
1 Like
3

Thank you for that.

So the document refers to the html code where as the window refers to whats actually being displayed?