Получить значение внутри тега span и изменить цвет фона в соответствии с условием?

Question

У меня есть код HTML для диапазона

<span id = "score" value = {{result['Status']}}  style="color: {{result['Status']}}">&#9873;</span>

Я хочу изменить цвет, если значение (значение = {{result ['Status']}}) в диапазоне является зеленым Я пытался использовать javascript

$(document).ready(function() {
var number = document.getElementById("score").innerHTML;

if (number == 'Red') {
 $(span).addClass("Red");
} else if (number == "Gold") {
  $(span).addClass("Gold");
} else if (number == 'Green') {
 $(span).addClass("Green");
}
});
`

В CSS добавил

.Green{
color:transparent;
}

Это не работает для меня

Answer 1

Если ваши трудовые дела js, то тут надо делать

$(document).ready(function() {
var number = document.getElementById("score");
var color=number.style.color;

if (color == 'red') {
 $('span').addClass("red");
} else if (color == "gold") {
  $('span').addClass("gold");
} else if (color == 'green') {
console.log('green go');
 $('span').addClass("green");
}
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span id = "score" value = 25  style="color: green">&#9873;</span>

Answer 2

Вместо внутреннего HTMl проверьте значение с помощью val ()

$(document).ready(function() {
var number = $("#score").val();

if (number == 'Red') {
 $("span#score").addClass("Red");
} else if (number == "Gold") {
  $("span#score").addClass("Gold");
} else if (number == 'Green') {
 $("span#score").addClass("Green");
}
});

Надеюсь, это поможет.