.removeProp() JQ Home  <<  A & P  <<  .removeProp()

Property removal.

Description

The .removeProp() method is used to remove a property from within the matched set.

  • Use the .removeProp() method to remove custom properties from an object that were added using the .prop() method.
  • Do not use the .removeProp() method to remove native properties such as checked, disabled, or selected. This will remove the property completely and, once removed it cannot be readded to the element. Use the .prop() method to set these properties to false instead.
  • Returns undefined for property values that haven't been or cannot be removed. What happens under the covers is jQuery first assigns undefined to the property to be removed and ignores any error the browser generates.
  • In IE6-8, when using the .prop() method to set a DOM element property to anything other than a simple primitive value (boolean, number or string), the method can cause memory leaks. This happens if the property is not removed using the .removeProp() method before the DOM element is removed from the document. To safely set values on DOM elements without memory leaks, use the .data() method.
  • Use a looping construct such as .each() or .map() to get element properties for all elements within the matched set.

Syntax

Signature Description
.removeProp( propertyName ) Remove a property from within the matched set.

Parameters

Parameter Description Type
propertyNameThe name of the property to remove.String

Return

A jQuery object.

.removeProp( propertyName ) Example A & P  <<  Top

Remove a property from within the matched set.

In the example below when we press the left button we add the 'title' attribute with a property of 'Thai Green Curry'. Mouseover the image after pressing the button to see the result.

In the example below when we press the right button we remove the property 'Thai Green Curry' from the 'title' attribute. Mouseover the image after pressing the button to see the result.


<img src="../../../images/thaigreencurrysmall.webp"
 alt="a picture of curry"  width="200"  height="150" />

a picture of curry


$(function(){
  $('#btn30').on('click', function() {
    $('#curry').prop({
       title: 'Thai Green Curry'
    });
  });
  $('#btn31').on('click', function() {
    $('#curry').removeProp(title);
  });
});

Press the button below to action the above code:

           

Related Tutorials

jQuery Basic Tutorials - Lesson 10 - Working With General CSS Properties