Answer 1

Oh so you want to switch it on each click. You could've explained it in the post's Description though, so we can go straight up to fixing the actual problem ...

The class "fa fa-thumbs-o-up" and "fa fa-thumbs-up" are combination of classes separated by space. That's why we get an error when we try to toggle by those classes. Class toggling apparently only supports single class name, so ... skip the "fa " and only toggle either "fa-thumbs-o-up" or "fa-thumbs-up"

thumbsUp.classList.toggle( "fa-thumbs-up" );

Answer 2

Hope this helps you

https://code.sololearn.com/WwGRcabta1zJ

Answer 3

That's a good question YourMom, let's hear what others' has to say, we can both learn something 👍

Answer 4

It might help if you log <Bell>'s class name after toggling the two classes, to see why two class' toggle was there.

function bell(Bell)
{
Bell.classList.toggle( "fa-bell-o" );
Bell.classList.toggle( "fa-bell" );
console.log( Bell.className );
}

Answer 5

hey Ipang and Your Mom , is here any flask developer? i was thinking to make a chatting server but it's hard to make it alone, can anyone help?
flask, postgresql or any other db, html +css +js ... anyone can help?

Answer 6

Ipang okey, thanks : (

Answer 7

Good

Answer 8

What was supposed to happen when the <i> was clicked?

Answer 9

Then don't use toggle(), directly set the class name instead ...

thumbsUp.className = "fa fa-thumbs-up";

Answer 10

From recent search I found that, FA 5 has extended the class "fa" to "far", "fas", "fab" etc depending on which CSS stylesheet was used.

Since you use FA 4, "far" class is not available yet, and you should rather use plain "fa"

<i onclick="bell(this)" class='fa fa-bell'></i>

+ Where I read about it ...
https://stackoverflow.com/questions/24922833/fontawesome-icons-are-not-showing-why

Answer 11

I didn't get what you mean ...
"color is transparent and when you click it color is transparent" 🙄

Answer 12

Aah now I get it, so it seems the "-o" has the same effect, but I don't know *for sure* whether this will work for all FA icons.

+ So in HTML
<i onclick="bell(this)" class='fa fa-bell-o'></i>

+ In JS
function bell(Bell)
{
Bell.classList.toggle( "fa-bell-o" );
Bell.classList.toggle( "fa-bell" );
}

Answer 13

Because "fa-bell" and "fa-bell-o" refer to different class.

The two lines toggle different classes, don't you see?

Answer 14

I have to go now, catch you later ...

Answer 15

Can you tell me what actually you want to do please, i might can help you

Answer 16

We can only toggle a single class at a time, so first we toggle "fa-bell-o" and then we toggle "fa-bell". We can't toggle both.

Why is it exactly that way, Idk LMAO

Answer 17

What's the problem with your button, they are working properly?

Answer 18

it's ok bro/sis : )

Answer 19

Malay Patra,
Idk either, but a question related to Python is frequent, sometimes including framework related stuffs.

I think you can publish a feeds post on that question about flask developer. I doubt asking whether anyone here work with flask in Q&A Discussion will get a respond as you expect, due to the scoping of topics per the guideline.

https://www.sololearn.com/Discuss/1316935/?ref=app

Answer 20

thumbsUp.classList.toggle( "fa-thumbs-up" );