[jquery] How to remove "onclick" with JQuery?

PHP code:

<a id="a$id" onclick="check($id,1)" href="javascript:void(0)"  class="black">Qualify</a>

I want to remove the onclick="check($id,1) so the link cannot be clicked or "check($id,1) won't be fired. How can I do it with JQuery?

Try this if you unbind the onclick event by ID Then use:

$('#youLinkID').attr('onclick','').unbind('click');

Try this if you unbind the onclick event by Class Then use:

$('.className').attr('onclick','').unbind('click');

After trying so hard with bind, unbind, on, off, click, attr, removeAttr, prop I made it work. So, I have the following scenario: In my html i have NOT attached any inline onclick handlers.

Then in my Javascript i used the following to add an inline onclick handler:

$(element).attr('onclick','myFunction()');

To remove this at a later point from Javascript I used the following:

$(element).prop('onclick',null);

This is the way it worked for me to bind and unbind click events dinamically in Javascript. Remember NOT to insert any inline onclick handler in your elements.

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

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"

What if onclick event is not directly on element, but from parent element? This should work:

$(".noclick").attr('onclick','').unbind('click');
$(".noclick").click(function(e){
    e.preventDefault();
    e.stopPropagation();
    return false;
});

It is very easy using removeAttr.

$(element).removeAttr("onclick");