jquery .bind for image onclick not working in Firefox?

I wonder why the below code works fine in IE but not Firefox (3.6.15)?

HTML:

<input type="image" name="btbuy1" id="btbuy1" src="img/buy.gif" disabled="disabled"/>

JavaScript:

EnableBuyButton(btbuy1);

function EnableBuyButton(ABtnId)
{
    var btElement = document.getElementById(ABtnId);
 开发者_开发百科   btElement.setAttribute("disabled", "");
    $('#' + ABtnId).bind('click', function ()
    {
        alert('User clicked buy btn');
    });
}

Have a look, I've also done a little tidying up http://jsfiddle.net/bkKNU/

<input type="image" name="btbuy1" id="btbuy1" src="img/buy.gif" disabled="disabled"/>

EnableBuyButton("btbuy1");

function EnableBuyButton(ABtnId)
{
    $('#' + ABtnId).attr("disabled","").bind('click', function ()
        {
            alert('User clicked buy btn');
        });
}

You want to use an id but you are actually using the Html element that is identified by the id,

try

EnableBuyButton('btbuy1');

in stead of

EnableBuyButton(btbuy1);

You can also call the Jquery selector with the element itself

$(btElement)

Try this:

$(function() {  
    var EnableBuyButton = function(ABtnId)
    {
            var btElement = $('#' + ABtnId);
            btElement.attr("disabled", "");
            btElement.bind('click', function ()
            {
                alert('User clicked buy btn');
            });
    }

    EnableBuyButton('btbuy1');
});

Hope it helps

jsfiddle: http://jsfiddle.net/aPvgm/1/

function EnableButton(id)
{
    $('#' + id)
    .removeAttr("disabled")
    .click(function ()
    {
        alert('User clicked buy btn');
    });
}