Combine multiple click handlers into one

Question

Say I have two click handlers which perform the same functionality :

$(\'#div1\').click(function(event) {  
alert(\'here\');                              
});

$         


        

Answer 1

Try this:

$('#div1, #div2').click(function(event) {  
   alert('here');                              
});

Furthermore, if you have a lot of div elements, contained in a common parent, you may take benefit of event delegation and attach a single handler to the parent itself, like so:

$('.common-parent').on('click', 'div', function(event) {  
   ...                          
});

Answer 2

First way :

$('#div1, #div2').click(function(event) {  
     alert('here');                              
});

Second way :

function doIt(e) {
    alert('here');
}
$('#div1').click(doIt);
$('#div2').click(doIt);

Note that the fact you have this problem sometimes means you should use a class and not just id, so that you may do something like

$('.alertable').click(function(event) {  
     alert('here');                              
});