How to remove "onclick" with JQuery?
Removing onclick
property
Suppose you added your click event inline, like this :
<button id="myButton" onclick="alert('test')">Married</button>
Then, you can remove the event like this :
$("#myButton").prop('onclick', null); // Removes 'onclick' property if found
Removing click
event listeners
Suppose you added your click event by defining an event listener, like this :
$("button").on("click", function() { alert("clicked!"); });
... or like this:
$("button").click(function() { alert("clicked!"); });
Then, you can remove the event like this :
$("#myButton").off('click'); // Removes other events if found
Removing both
If you're uncertain how your event has been added, you can combine both, like this :
$("#myButton").prop('onclick', null) // Removes 'onclick' property if found
.off('click'); // Removes other events if found
Old Way (pre-1.7):
$("...").attr("onclick", "").unbind("click");
New Way (1.7+):
$("...").prop("onclick", null).off("click");
(Replace ... with the selector you need.)
// use the "[attr=value]" syntax to avoid syntax errors with special characters (like "$")
$('[id="a$id"]').prop('onclick',null).off('click');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a id="a$id" onclick="alert('get rid of this')" href="javascript:void(0)" class="black">Qualify</a>
if you are using jquery 1.7
$('html').off('click');
else
$('html').unbind('click');
I know this is quite old, but when a lost stranger finds this question looking for an answer (like I did) then this is the best way to do it, instead of using removeAttr():
$element.prop("onclick", null);
Citing jQuerys official doku:
"Removing an inline onclick event handler using .removeAttr() doesn't achieve the desired effect in Internet Explorer 6, 7, or 8. To avoid potential problems, use .prop() instead"