jQuery - Pass element to function

Question

Hi I have a function that i want to pass an element to via clicking the element or calling the function with the element as a paramter. This is what I have:

function change_btm_cat(item) {
        $('div.prod_matrix').removeClass('block');
        $('div.prod_matrix').addClass('none');
        $('div.prod_matrix#'+item.attr('id')).removeClass('none');
        $('div.prod_matrix#'+item.attr('id')).addClass('block');
        $('div.btm_cat').removeClass('green_grad');
        $('div.btm_cat').addClass('grey_grad');
        item.removeClass('grey_grad');
        item.addClass('green_grad');
        //ps. i know its messy, just testing stuff
    }

I can easily get it to work using this:

$('div.btm_cat').click(function() {
        change_btm_cat($(this));
    });

But when i try:

$('another.element').live('click', function() {
   change_btm_cat($('div.btm_cat#7'));
});

It seems to pass nothing to the function.

See jsFiddle for working example: http://jsfiddle.net/rb7ZG/1/

Answer 1

try:

$('div.btm_cat').click(change_btm_cat);

function change_btm_cat()
{
     $(this) //becomes available
}

and

$('another.element').live('click', change_btm_cat);