Múltiples ID en un solo evento de clic de JavaScript

En JavaScript, estoy usando el evento de clic para cambiar los datos del gráfico. A continuación se muestra un método para el evento de clic.

$('#pro1').click(function () {
            chart.series[0].update({
                data: pro1
            });
        });
        $('#pro2').click(function () {
            chart.series[0].update({
                data: pro2
            });
        });
        $('#pro3').click(function () {
            chart.series[0].update({
                data: pro3
            });
        });

Necesito minimizar estos tres eventos de clic en un evento, lo que significa que quiero escribir un evento de clic que maneje las identificaciones. algo como el siguiente código.

$('#pro'+i).click(function () {
chart.series[0].update({
     data: pro+i
});
});

No sé cómo hacerlo exactamente. El código anterior no es correcto, es solo mi falta de conocimiento de JavaScript.

Prueba esto:

var that = this;
$('#pro1,#pro2,#pro3').click(function () {
    chart.series[0].update({
        data: that[$(this).attr('id')];
    });
});

Sugeriría crear un objeto y seleccionar los elementos usando clases, id del elemento en el que se hizo clic recupera el valor de la propiedad correspondiente del objeto auxiliar:

var pros = {
   pro1: '...',
   pro2: '...'
};

$('.pros').click(function () {
    chart.series[0].update({
        data: pros[this.id]
    });
});

$('#pro1,#pro2,#pro3').click(function () {
    chart.series[0].update({
        data: $(this).attr('id');
    });
});

Código actualizado

$('#pro1,#pro2,#pro3').click(function () {
    chart.series[0].update({
        data: window[this.id]
    });
});

Usa una clase.

$('.pro').click(function () {
 chart.series[0].update({
   data: $(this).attr('id');
 });
});

Y luego en cada uno de los elementos #pro1, #pro2, #pro3 agregue una clase de ‘pro’

$("*[id^=pro]").click(function () {
    chart.series[0].update({
         data: $(this).attr('id');
    });
});

Podría dar a todos sus elementos un nombre de clase y usar el selector :eq() dentro de jQuery.

Usando cada función () puedes hacerlo

var i =0;
$("#pro"+i+", #pro"+i+", #pro"+i+"").each(function(){
            $(this).on('click', function(){
chart.series[0].update({
     data: pro+i
});

});});