acessing styling of flickity elements through js

Hello,

I have a problem Issue with accessing the styling, in my case, of the indicator dots, through js. I want the dots to be colored from an array (in my project it should be a dynamic array but for the reduced test case its static for now) my function works on elements with the same class name as the indicator dots that I've put in the html below the flickity carousel.

Here is the forked and changed codepen to illustrate my problem:
https://codepen.io/Insa-Deist/pen/jOXNOKM

I'm sorry if this is not the right place to ask for coding advice and thank you in advance for any tips!

Start with the linked CodePen and its Flickity carousel and indicator-dot elements; reproduce the styling access problem in the browser console and inspect how the dots are created. Done would require a confirmed project-level change or documented guidance, neither of which is specified here.

Written by the indexing model from the issue text.