Question

I have several fish images, within links, which are listed like so…

<a href="#" class="trigger"><img src="img/fish1.png" id="fish1"/></a>
<a href="#" class="trigger"><img src="img/fish2.png" id="fish2"/></a>

I want to take id ‘fish1’, ‘fish2’, ect. (based on which is clicked), and use a variable to replace some text.

The name of the variables are…

var fish1Hunger
var fish2Hunger

And the function I want to call with a variable is…

$(function() {
    $('a.trigger').click(function() {
        $('#popUp h3').html(REPLACE WITH VARIABLE ASSOCIATED WITH THE FISH);
    });
});

How can I call the variable associated with the IMG id?

Answer 1

window[e.srcElement.id+"Hunger"];

Put that inside your click event with e being the event (function (e){...) and it should access the variable as long as it is in the global scope.