# Back for more trouble, trying to make a sprite clickable

**URL:** <https://phaser.discourse.group/t/back-for-more-trouble-trying-to-make-a-sprite-clickable/8379>\
**Category:** Phaser 3\
**Created:** [December 16, 2020, 4:28am UTC](https://phaser.discourse.group/t/back-for-more-trouble-trying-to-make-a-sprite-clickable/8379 "2020-12-16T04:28:38Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Clooloo](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/clooloo/32/4474_2.png) [@Clooloo](https://phaser.discourse.group/u/Clooloo)\
**Post date:** [December 16, 2020, 4:28am UTC](https://phaser.discourse.group/t/back-for-more-trouble-trying-to-make-a-sprite-clickable/8379/1 "2020-12-16T04:28:38Z")

</div>

Hi all, first of all, thanks for all previous replies they have been very helpful, I have advanced quite a bit in my project but Im stuck again, this is my code below (I will explain the issue below the code):

```
	this.load.atlas('enemies', 'enemies.png','enemies.json'); ####This goes on preload function

#####everything below I added to create function
var monsterData = [
        {name: 'Aerocephal', image: 'aerocephal'},
        {name: 'Arcana Drake', image: 'arcana_drake'},
        {name: 'Aurum Drakueli', image: 'aurum-drakueli'},
        {name: 'Bat', image: 'bat'},
        {name: 'Daemarbora', image: 'daemarbora'},
        {name: 'Deceleon', image: 'deceleon'},
        {name: 'Demonic Essence', image: 'demonic_essence'},
        {name: 'Dune Crawler', image: 'dune_crawler'},
        {name: 'Green Slime', image: 'green_slime'},
        {name: 'Nagaruda', image: 'nagaruda'},
        {name: 'Rat', image: 'rat'},
        {name: 'Scorpion', image: 'scorpion'},
        {name: 'Skeleton', image: 'skeleton'},
        {name: 'Snake', image: 'snake'},
        {name: 'Spider', image: 'spider'},
        {name: 'Stygian Lizard', image: 'stygian_lizard'}
    ];

    var monsters = this.add.group();
    	var monster;
    	let currentmonster = Phaser.Utils.Array.GetRandom(monsterData);
    	
    	monsterData.forEach(function(data) {
        monster = monsters.create(400,300, 'enemies', currentmonster.image).setOrigin(0.5);
        monster.details = data;  
        
        
        });
    	monster.on('pointerdown', function (pointer) {
            this.setTint(0xff0000);
           
        });
        monster.on('pointerout', function (pointer) {
            this.clearTint();
        });
        monster.on('pointerup', function (pointer) {
            this.clearTint();
        });

```

_Basically my monsters do spawn as expected and they do change sprite every time I refresh the page, but the click function does not works, it simply wont click on it, and nothing happens, no errors on console nothing, am I approaching this incorrectly? please any suggestion is greatly appreciated._

my base functions look like the ones on this tutorial: [Tutorial](https://phaser.io/tutorials/making-your-first-phaser-3-game/part1)

---

<div class="post-metadata">

**Author:** ![Milton](https://avatars.discourse-cdn.com/v4/letter/m/87869e/32.png) [@Milton](https://phaser.discourse.group/u/Milton)\
**Post date:** [December 16, 2020, 5:23am UTC](https://phaser.discourse.group/t/back-for-more-trouble-trying-to-make-a-sprite-clickable/8379/2 "2020-12-16T05:23:51Z")

</div>

Hmm, this doesn’t seem to make a lot of sense.  
You pick a monster.  
Then for each type of monster you create a monster with the chosen image, but give it the details of the iterating type.  
But the bigger problem is that you overwrite monster. In the end there is only 1 monster reference. And since you put the pointer handlers outside the forEach loop, only the last one will remain.