Не могу изменить шрифт-удивительный цвет значка при клике

Question

Я не могу присвоить цвет тегу i font-awesome.

Вместо этого я могу присвоить цвет i: before, и это сработает.

Нопроблема в том, когда я хочу изменить цвет при нажатии,: до того, как элемент не работает.

Я пытался дать CSS как i: active: before {color: green}, но это не сработало.

    <!--HTML-->
    <i class="fa fa-thumbs-up"></i>

    <!--CSS-->
    i:active::before{color:green}

Я ожидаю, что вывод должен быть зеленым значком при щелчке ... но он просто не работает. Пожалуйста, помогите.

Answer 1

Вы должны использовать JavaScript.

let icon = document.querySelector('i');
icon.addEventListener('click',function(){
  icon.style.color = "green";
})