Changing backgroud color depending on text value

I am trying to change the color of background depends on brand’s name.
It seems not reading const elements = document.querySelectorAll(’#brand’);
sometimes I get Cannot read property error because it runs before html?

Thanks for your advise.

You can only have one item with a query selector of an id, which is why the current code doesn’t work. You have some options to change this to be working.

  1. styling via css:

  2. styling via JS in the template:

  3. styling via JS in transformItems:

Hope that clarifies the different strategies!

My actual index is little more complicated so yours did not work.
I would like to change the color of objectType attribute.Screenshot 2020-12-23 110146 Screenshot 2020-12-23 110204
Eventually, it will be total 4 attributes.
News, Startup, Comment, Startup List

Please take a look.
nssc is the best search word to check both startUp and Startup List
Thank you very much!!

Hi @ynaka, you may have to use some creative css to get the results you want. You could store the value of the attribute in a variable and use that variable name in the class, the assign styles to that class. For instance, have a css class for ‘startup’ and add ‘startup’ to the class attribute of the div.