How to remove CSS property using JavaScript? Last Updated : 11 Jul, 2025 Summarize Comments Improve Suggest changes Share Like Article Like Report To remove CSS property using JavaScript, we have different methods. In this article, we will learn how to remove CSS property using JavaScript. Below are the Methods used to remove CSS property using JavaScript: Table of Content Using CSS removePropertyUsing the setProperty methodMethod 1: Using CSS removePropertyThe CSStyleDeclaration.removeProperty() method is used to remove a property from a style of an element. The style of the element is selected by going through the styleSheets array and selecting the cssRule. The removeProperty method can then be specified with the property to be removed. Syntax:element.removeProperty('property');Example: In this example, we have used CSS removeProperty. html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> .elem { color: green; font-size: 3rem; text-decoration: underline; } </style> </head> <body> <h1 style="color: green"> GeeksForGeeks </h1> <b> How to remove CSS property using JavaScript? </b> <div class="elem">Hello World!</div> <p> Click on the button below to remove the text decoration of the element </p> <button onclick="removeProperty()"> Remove text-decoration property </button> <script> function removeProperty() { element = document.styleSheets[0].cssRules[0].style; element.removeProperty('text-decoration'); } </script> </body> </html> Output: How to remove CSS property using JavaScript?Method 2: Using the setProperty methodThe CSSStyleDeclaration.setProperty() method can be used to set the required property of the style. The element of which the property has to be removed is selected and this property is applied to its style property. Setting this property to 'initial' resets the property to its initial value, removing any effect of the property. Syntax:element.style.setProperty('color', 'initial')Example: In this example, we have used CSS removeProperty. html <!DOCTYPE html> <html> <head> <title> How to remove CSS property using JavaScript? </title> <style> .elem { color: green; font-size: 3rem; text-decoration: underline; } </style> </head> <body> <h1 style="color: green"> GeeksForGeeks </h1> <b> How to remove CSS property using JavaScript? </b> <div class="elem">Hello World!</div> <p> Click on the button below to remove the text color of the element </p> <button onclick="removeProperty()"> Remove color property </button> <script> function removeProperty() { element = document.querySelector('.elem'); element.style.setProperty('color', 'initial'); } </script> </body> </html> Output: How to remove CSS property using JavaScript? Comment More infoAdvertise with us Next Article How to add CSS Rules to the Stylesheet using JavaScript ? S sayantanm19 Follow Improve Article Tags : JavaScript JavaScript-Questions Similar Reads How to Remove a Property From JavaScript Object? The delete operator is used to remove a property from a JavaScript object. The delete operator allows you to remove a specified property from an object. Once a property is deleted, it no longer exists in the object.Using delete OperatorThe basic method to remove a property from a JavaScript object i 3 min read How to read CSS rule values with JavaScript? DOM (Document Object Model) object can read and manipulate CSS rules. We can use the following approaches to read all the Embedded CSS rules using JavaScript. Using getElementsByTagName() MethodUsing window.getComputedStyle() MethodApproach 1: Using the getElementsByTagName() MethodUse document.getE 3 min read How to Remove all Inline Styles using JavaScript/jQuery? To remove all inline styles from an element using JavaScript or jQuery, the removeAttribute method in JavaScript or the removeAttr method in jQuery can be used. Approach: The jQuery attr() and removeAttr() methods are used to remove the inline style property. The attr() method sets the attribute val 2 min read How to remove a Class name from an Element using JavaScript ? Removing a class name from an HTML element using JavaScript is often used to dynamically modify the styling or behavior of an element based on user interactions, events, or other conditions. The operation can be achieved using classList property, that allows you to add, remove, or toggle classes. Sy 3 min read How to add CSS Rules to the Stylesheet using JavaScript ? In this example, we will see how to add CSS rules to the stylesheet element using JavaScript. First, we will create an HTML document and then add some CSS rules using JavaScript. Syntax: let styleText = document.getElementById('GFG').sheet; let st = `.box { width: 100px; height: 100px; }`; styleText 2 min read How to remove CSS style of <style> tag using JavaScript/jQuery ? Given an HTML document containing inline and internal CSS and the task is to remove the style of <style> tag. The internal or embedded CSS is used within the head section of the HTML document. It is enclosed within <style> tag. Approach: The jQuery remove() and empty() methods are used t 2 min read Like