I have a dynamic array of divs representing numbered lists i.e.
Array.from({length: data.length}).map((item,value)=>(
<div onClick={()=>sliderRef.current.slickGoTo(index)}></div>
))
I have 2 classes, dot which is a gray color, active which is red. How can change the color of div to red which is clicked/selected and the rest be gray?
You use React, right? You could write a Component instead of your div that should contain a state variable of isClicked and a function handleClick. HandleClick can then set isClicked to true. Then you can have conditional styling, like:
<div style={{backgroundColor: isClicked ? "red" : "gray"}} />