Preventing code replication in javascript by combining these functions

Question

So I have two jquery functions that bassically do the same, but on 2 seperate containers. Is there a way to combine these two functions.

$('#autobid-list .auction-button').click(
    function(){
        if($(this).attr('summary') == 'autobid-button'){
            $(this).parents('li').addClass('none');
        }else if($(this).attr('summary') == 'watchlist-button'){
            if($(this).hasClass('watchlist-1')){
                $(this).parents('li').clone().appendTo('#watchlist-list');
            }else{
                $('#watchlist-list .auction-' + $(this).parents('table').attr('summary')).parents('li').addClass('none');
            }
        }
    }
);

$('#watchlist-list .auction-button').click(
    function(){
        if($(this).attr('summary') == 'watchlist-button'){
            $(this).parents('li').addClass('none');
        }else if($(this).attr('summary') == 'autobid-button'){
            if($(this).hasClass('autobid-1')){
                $(this).parents('li').clone().appendTo('#autobid-list');
            }else{
                $('#autobid-list .auction-' + $(this).parents('table').attr('summary')).parents('li').addClass('none');
            }
        }
    }
);

These two do bassically the same, the only change is the input of either 'autobid' or 'watchlist'

Answer 1

Sure, just determine which one was clicked and assign a variable according to that. You can select several elements at once when you separate them with commas:

$('#watchlist-list .auction-button, #autobid-list .auction-button').click(function() {

    // Determine which button was clicked, you might want to adjust this as needed.
    var type = $(this).closest('#autobid-list').length > 0 ? 'autobid' : 'watchlist';

    // Then just replace 'autobid' and 'watchlist' with 'type'
    if($(this).attr('summary') == type+'-button') {
        $(this).parents('li').addClass('none');
    } else if($(this).attr('summary') == type+'-button') {
        if($(this).hasClass(type+'-1')) {
            $(this).parents('li')
                .clone()
                .appendTo('#'+type+'-list');
        } else {
            $('#'+type+'-list .auction-' + $(this).parents('table').attr('summary'))
                .parents('li')
                .addClass('none');
        }
    }
});

Answer 2

Could this work? Make a function that returns a function:

function MyFunction(type) {
    return function(){
        if($(this).attr('summary') == type + '-button'){
            $(this).parents('li').addClass('none');
        }else if($(this).attr('summary') == type + '-button'){
            if($(this).hasClass(type + '-1')){
                $(this).parents('li').clone().appendTo('#' + type + '-list');
            }else{
                $('#' + type + '-list .auction-' + $(this).parents('table').attr('summary')).parents('li').addClass('none');
            }
        }
    }
}

$('#autobid-list .auction-button').click(MyFunction('autobid'));
$('#watchlist-list .auction-button').click(MyFunction('watchlist'));

Answer 3

Obvious answer:

$('#watchlist-list .auction-button').click(function(){
    whatever.call(this,'watchlist', 'autobid');
});
$('#autobid-list .auction-button').click(function(){
    whatever.call(this,'autobid', 'watchlist');
});

function whatever(one, two){
    if($(this).attr('summary') == one + '-button'){
        $(this).parents('li').addClass('none');
    }else if($(this).attr('summary') == two + '-button'){
        if($(this).hasClass(two + '-1')){
            $(this).parents('li').clone().appendTo('#' + two + '-list');
        }else{
            $('#' + two + '-list .auction-' + $(this).parents('table').attr('summary')).parents('li').addClass('none');
        }
    }
}

Though some rethinking is probably better.

EDIT: Oops, fixed.