CODEWITHSUNDEEP
htmlcssiconsfont-awesome
Tejas
Tejas

Reputation: 45

Can not change font-awesome icon color on click

I am not able to give color on i tag of font-awesome.

Instead I can give color to i:before and it works.

But the problem is when I want to change the color on click, :before element does not work.

I tried to give css like i:active:before{color:green} but it did not work.

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

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

I expect the output should be the green icon on click..but it just do not work. Please help.

Upvotes: 0

Views: 206

Answers (1)

FBR
FBR

Reputation: 179

You have to use JavaScript.

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

Upvotes: 1

Related Questions