Css style change depending of value text

I would like to color the text in the with 4 different colors depending on the value. The value scale ranges from 0.0 to 10.0

For example: 0.0 to 2.5 red, 2.6 to 5.0 yellow, 5.1 to 7.5 blue, 7.6 to 10.0 green.

How can I do using javascript?

Be careful that the value within the is picked up by a Controller.

<span th:text="${value}">1.0</span>

If I wanted to use th: classappend?