Yogesh Chauhan's Blog

How to change CSS with JavaScript?

in CSS & JavaScript on August 23, 2020

We can add, remove or change CSS property values with JavaScript via an element's style property.

Step 1

Get the element via ID or class.


var element = document.getElementById("ID_Name");

Step 2

Change the CSS property.


element.style.opacity = 1;
element.style.fontFamily = 'sans-serif';

The property name changes (not completely!) when we use JavaScript. So, font-family becomes fontFamily.


Most Read

#1 Solution to the error “Visual Studio Code can’t be opened because Apple cannot check it for malicious software” #2 How to add Read More Read Less Button using JavaScript? #3 How to check if radio button is checked or not using JavaScript? #4 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #5 How to uninstall Cocoapods from the Mac OS? #6 PHP Login System using PDO Part 1: Create User Registration Page

Recently Posted

#Apr 8 JSON.stringify() in JavaScript #Apr 7 Middleware in NextJS #Jan 17 4 advanced ways to search Colleague #Jan 16 Colleague UI Basics: The Search Area #Jan 16 Colleague UI Basics: The Context Area #Jan 16 Colleague UI Basics: Accessing the user interface
You might also like these
WordPress: How to find all posts from a custom post type with specific custom field?WordPressA complete guide to add responsive YouTube videos using HTML and CSSCSSapply_filters function in WordPressWordPressWHERE Clause in PostgresPostgresActions vs. Filters: hooks in WordPressWordPressHow to scroll contents of HTML body horizontally and vertically using JavaScript?JavaScriptHow to create a Horizontal Scroll on button click using JavaScript?JavaScriptList of WordPress directories functionsWordPressCan Firewall and IDPS Stop DDoS Attack?MiscellaneousHow to reprocess failed items in Etrieve Flow?MiscellaneousHow to change value of a span tag using a reference from another div using jQuery?jQueryHow to vertically and horizontally align text and image block (without flex or grid) in CSS?CSS