Last Updated on September 14, 2022 by Roshan Parihar
In this tutorial, learn how to remove attribute from element using jQuery. The short answer is to use jQuery removeAttr()
function and pass the attribute name as its argument.
You can also use the attr()
function to remove the attributes from the element. Let’s find out the different useful methods given below.
Method 1: jQuery Remove Attribute From Element with removeAttr()
Function
To remove the attribute from the element, you can use the removeAttr()
function that requires a single argument. You have to specify the attribute as the argument of the element that you want to remove.
1 2 3 4 5 6 7 8 9 10 11 |
<script> $(document).ready(function(){ $('button').click(function(){ $("div").removeAttr("style"); }); }); </script> <button type="button">Remove Attribute</button> <div style="border:1px solid #ccc;color:red;padding:10px;"> This is simple content inside a div element. </div> |
Output
The above example contains the button element and the text content with style
attribute. When you click the button given above, the attribute style
gets removed from the div element that removes the applied CSS to the text content.
Method 2: Using Attr()
Function of jQuery
You can also remove attributes from the element using attr()
function of jQuery. The function takes two arguments to specify and remove the attribute. The first argument is the attribute name and the second is the blank value within quotes (” “).
1 2 3 4 5 6 7 8 9 |
<script> $(document).ready(function(){ $('button').click(function(){ $("p").attr("style",""); }); }); </script> <button type="button">Remove Attribute</button> <p style="color:blue;padding:10px;">This is a paragraph.</p> |
Output
This is a paragraph.
The above example contains the button element and the paragraph content. When you click the button, it removes the style
attribute including the CSS applied to the element.
In addition to the removal of the style
attribute, these methods can also remove the other attributes from the HTML element using jQuery.
You May Also Like to Read
- How to Show/Hide Div On dropdown Selection Using JQuery
- How to Show/Hide Div On Select of the Radio Button Using JQuery
Reference