HTML METHODS - removeAttr()

The removeAttr() method in JQuery is used to remove an attribute from an HTML element.

Example :

<html>
    <head>
    	<title> My First Programme </title>
  	</head>

  	<body>
    	<h1> JQuery </h1>
    	<p style = "color: red">New Code</p>
        
    	<button class = "removeBtn"> Click to remove Property </button>

      	<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"> </script>
	  
      	<script>
            
            $('button.removeBtn').click( function() {
				$('p').removeAttr("style");
			});
            
      	</script>      
   </body>
</html>

Output :

So, in the above code, we have a <p> element,

<p style = "color: red">New Code</p>

And in the <p> element, there is an attribute named style that is setting the color of the element to red(i.e. style = "color: red").

And on button click, the below JQuery statement gets triggered,

$('button.removeBtn').click( function() {
	$('p').removeAttr("style");
});

And there is the removeAttr() method, that removes the style attribute from the <p> element.

$('p').removeAttr("style");

And if you see the output, on button click, the color of the <p> element,

New Code

Changes from red to black.

❮❮ PREV NEXT ❯❯