HTML DOM removeEventListener() Method

Last Updated : 10 Aug, 2026

The removeEventListener() method is used to remove an event handler associated with the addEventListener() method. This method of removing event handler can be used only with the addEventListener() method specified using an external function.

Syntax

element.removeEventListener(event, function, useCapture);

Parameters

  • event: The parameter event specifies the name of the event to be removed.
  • function: The parameter function specifies the function to be removed.
  • useCapture: The parameter useCapture denotes the event phase to be removed from the event handler. If useCapture has the boolean value true, it removes the event handler from the capturing phase else it removes the event handler from the bubbling phase.

Example: In the below example, calls event handler which changes the color of the division tag on mousemove over division. After pressing the change color button, the event handler associated with the division tag gets removed and no color change appears on mousemove over division. 

html 
<!--Driver Code Starts-->

<!DOCTYPE html>
<html>
<head>
    <style>
        #myDIV {
            font-size:60px;
            border: 1px solid;
            padding: 50x;
            color: black;
        }
    </style>
</head>

<body>
    <div id="myDIV">
        GeeksForGeeks
    <br>
        
        <button onclick="removeHandler()" id="myBtn">
            Change color
        </button>
    </div>
    
<!--Driver Code Ends-->

    <script>
        document.getElementById("myDIV")
            .addEventListener("mousemove", myFunction);
        
        function myFunction() {
            document.getElementById("myDIV")
                        .style.color= "green";
        }
        
        function removeHandler() {
            document.getElementById("myDIV")
            .removeEventListener("mousemove", myFunction);
        }
    </script>

<!--Driver Code Starts-->
</body>
</html>                    

<!--Driver Code Ends-->
  • Must match the exact same function reference : You need to pass the same function object that was used in addEventListener(). Anonymous functions or differently referenced functions cannot be removed.
  • Options must also match : If you added the listener with options (e.g., { capture: true } or useCapture), you must provide the same options when removing it for the removal to succeed.
Comment

Explore