CODEWITHSUNDEEP
javascriptcss
M.Ahmed
M.Ahmed

Reputation: 67

How to change css style by javascript

I have css style

chosen-container b::after {
font-family: FontAwesome;
content: "\f078";
}

I need to change this attribute by java script to become:

chosen-container b::after {
font-family: FontAwesome;
content: "\f077";

Upvotes: 0

Views: 83

Answers (1)

Tanasos
Tanasos

Reputation: 4098

Using plain vanilla Javascript , you can do this using the following code:

var cont = document.getElementByClassName(".chosen-container");
cont.className += " container-selected";

A better practice is to apply another modifier class to your element.

You are storing the chosen container as a variable and telling javascript to apply an additional class to it (.container-selected) or one of your choice.

Then simply apply the needed changes to that modifier class like so:

.chosen-container.container-selected b::after {
     font-family: 'FontAwesome';
     content: "\f077"; 
}

Therefore, javascript will look for that element, apply the new class with the updated icon to it and voila.

Upvotes: 1

Related Questions