JQuery - добавить событие щелчка к нескольким элементам

Question

я следующее:

$('#applicationsGrid tbody').on('click', 'td.details-control', function() { 
    var formattedData = dosomething(); 
    $(this).parent('tr').after(formattedData); 
}); 

$('#applicationsGrid tbody').on('click', 'td.child-details-control', function() { 
    var formattedData = dosomething(); 
    $(this).parent('tr').after(formattedData); 
}); 

$('#applicationsGrid tbody').on('click', 'td.grand-child-details-control', function() { 
    var formattedData = dosomething(); 
    $(this).parent('tr').after(formattedData); 
}); 

Как я могу объединить все «на» события в одно событие щелчка, который будет заботиться о нажатии на «td.details-контроль ',' td.child-details-control ',' td.grand-child-details-control ', поэтому я могу уменьшить дубликат кода?

Answer 1

Использование Multiple Selector («selector1, selector2, selectorN») в JQuery

$('#applicationsGrid tbody').on('click', 'td.details-control,td.child-details-control,td.grand-child-details-control', function() { 
     var formattedData = dosomething(); 
     $(this).parent('tr').after(formattedData); 
}); 

Learn Multiple selector

Answer 2

Только вы можете сцепить с мультиселектора

$('#applicationsGrid tbody').on('click', 'td.details-control,td.child-details-control,td.grand-child-details-control', function() { 
       var formattedData = dosomething(); 
       $(this).parent('tr').after(formattedData); 
      }); 

ИЛИ использовать end with selector , в вашем случае все значение класса заканчивается данные-контроль,

$('#applicationsGrid tbody').on('click', ,'td[class$=details-control]', function() { 
       var formattedData = dosomething(); 
       $(this).parent('tr').after(formattedData); 
      });