Question

Having a confusing issue with jQuery, basicly this code is added to 2 elements, and works fine, but I wan it to NOT work if you click a seperate element, I thought removing the class from these elements would stop them from workign, but even with no class they are still working… here some code.

$(".q1a1, .q1a3").click(function (e) {
e.preventDefault();
$(this).animate({ backgroundColor: "#db384b" }, 1000);
$(this).animate({ backgroundColor: "#0F437D" }, 2000);
$(this).children('.wrong').fadeIn(1000).fadeOut(2000);
});

^ I want this code to not work after the code below is clicked (if that makes sense)

$(".q1a2").click(function (e) {
e.preventDefault();
$(this).animate({ backgroundColor: "#00a6eb" }, 800);
$('.q1a2 .correct').show();
$('.q1a1, .q1a3 ').removeAttr("class");
});

Any ideas?

Answer 1

Removing the class will not help, as you have already attached the click event to the element.

You should use unbind to remove

$('.q1a1, .q1a3 ').unbind("click");

http://api.jquery.com/unbind/