Jquery RemoveClass not working for bootstrap buttons - jquery-ui

Question

I am having trouble using the Jquery removeClass functionality to disable a certain class. The class definition is given below
.btn-purple
{
background-color: #F1B2E1;
background-image: -moz-linear-gradient(top, #F1B2E1, #E986D0);
background-image: -ms-linear-gradient(top, #F1B2E1, #E986D0);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#F1B2E1), to(#E986D0));
background-image: -webkit-linear-gradient(top, #F1B2E1, #E986D0);
background-image: -o-linear-gradient(top, #F1B2E1, #E986D0);
background-image: linear-gradient(top, #F1B2E1, #E986D0);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F1B2E1', endColorstr='#E986D0', GradientType=0);
border-color: #0055cc #0055cc #003580;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:dximagetransform.microsoft.gradient(enabled=false);
}
.btn-purple:hover,
.btn-purple:active,
.btn-purple.active,
.btn-purple.disabled,
.btn-purple[disabled] {
background-color: #E986D0;
}
In the javascript file I have the following
$(function(){
$("#1").click(function(){
$("#1").removeClass("btn-purple", 1000);
return false
});
});
And here is the HTML markup for the section I wish to remove the class definition from
<div id="1" class="span3 well homeBox opaque btn-purple">
<span class="siteBoxContent">What do we do?</span>
</div>
And here is the error I'm getting while debugging in the Webkit Error Console
TypeError: 'undefined' is not an object (evaluating 'fx.end[0]') jquery.effects.core.js:32
If I try to remove a class like 'homeBox', the removeClass works fine. Here is the definition for the homeBox class definition
.homeBox
{
position:relative;
width:26.666666666667%;
height:200px;
}
So I'm guessing jQuery may have a problem with removing classes which have background-image, colour or even the filter attributes. If you require any more information, please let me know. Thanks in advance for your help.

Answer 1

Use:
$("#1").removeClass("btn-purple");
Instead of:
$("#1").removeClass("btn-purple", 1000);
since there is not second argument available for it and 1000 doesn't make any sense there.
Two possible signatures of it are:
.removeClass( [className] )
.removeClass( function(index, class) )
More Info:
http://api.jquery.com/removeClass/

Answer 2

You use a function signature that doesn't exist:
removeClass("classname", integer) // WRONG
There's no such possibility in JQuery AFAIK, you can do:
.removeClass( [className] )
.removeClass( function(index, class) ) // from version 1.4
I don't understand what 1000 stands for, but I bet that removing it should fix the issue.