jQuery removeProp() example

The removeProp() method removes a property set by the prop() method.

Description

Remove a property for the set of matched elements.

Syntax

.removeProp( propertyName )
propertyName - The name of the property to remove.

Example 1

Set a numeric property on a paragraph and then remove it.
<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>removeProp demo</title>
    <style>
        img {
            padding: 10px;
        }

        div {
            color: red;
            font-size: 24px;
        }
    </style>
    <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
</head>

<body>

    <p></p>

    <script>
        para = $("p");
        para
            .prop("luggageCode", 1234)
            .append("The secret luggage code is: ", String(para.prop("luggageCode")), ". ")
            .removeProp("luggageCode")
            .append("Now the secret luggage code is: ", String(para.prop("luggageCode")), ". ");
    </script>

</body>

</html>
Try it Yourself - Copy paste code in Online HTML Editor to see the result

Example 2

Add and remove a property named "color":
<!DOCTYPE html>
<html>

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script>
        $(document).ready(function() {
            $("button").click(function() {
                var $x = $("div");
                $x.prop("color", "FF0000");
                $x.append("The color property has the following value: " + $x.prop("color"));
                $x.removeProp("color");
                $x.append("<br>Now the color property has the following value: " + $x.prop("color"));
            });
        });
    </script>
</head>

<body>

    <button>Add and remove a property</button><br><br>

    <div></div>

</body>

</html>
Try it Yourself - Copy paste code in Online HTML Editor to see the result

References

Comments