phaser Can't get animation to play before i destroy enemy

[Bancat]

Hello:

So I'm trying to make a bubble popping game where once the balloon pops it shows an animation before getting deleted off the screen. but I can't get the enemy.animations.play() to work if it's in a different function, but once I  place it in the create function it works fine so it's not a syntax error(i think).

This is where I initialize the enemy

playState.prototype.spawnEnemies = function(){
    if (this.waveProperties.counter > 0) {
        while (this.waveProperties.active < this.waveProperties.max / 2) {

            var type = Phaser.ArrayUtils.getRandomItem(["enemyLarge", "enemyMed", "enemySmall"]);

            var enemy = this.enemies.create(null, null, enemyProperties[type].img);
            enemy.reset(game.rnd.integerInRange(80, 1400), game.rnd.integerInRange(50, 400));
            enemy.anchor.setTo(0.5, 0.5);
            enemy.body.collideWorldBounds = true;
            enemy.body.bounce.set(1);
            enemy.body.allowGravity = false;

            enemy.animations.add('pop', [1,2,3,4,5],30,false);

            enemy.body.velocity.y = game.rnd.integerInRange(enemyProperties[type].minV, enemyProperties[type].maxV) * game.rnd.pick([-1, 1]);
            enemy.body.velocity.x = game.rnd.integerInRange(enemyProperties[type].minV, enemyProperties[type].maxV) * game.rnd.pick([-1, 1]);
            enemy.nextSize = enemyProperties[type].nextSize;
            enemy.hp = enemyProperties[type].hp;
            enemy.dmg = enemyProperties[type].dmg;
            enemy.points = enemyProperties[type].points;
            enemy.bubbleSfx = game.add.audio('bubbleSfx');
            enemy.bubbleSfx.allowMultiple = true;

            this.waveProperties.counter -= enemyProperties[type].points;
            this.waveProperties.active += enemyProperties[type].points;


        }
        } else {
        console.log("Next wave started..");
        //add text that shows PREPARE FOR NEXT WAVE here.
        this.waveProperties.max *= 2;
        this.waveProperties.timeCheck += this.waveProperties.timeCheck;
        this.waveProperties.counter = this.waveProperties.max;
        }
};

this is where it checks if the bullet collided with the enemy and if health is 0 it will play the animation then get destroyed

playState.prototype.hitEnemy = function(bullet, enemy){
    switch(bullet.key){ //checks which kind of weapon hit the enemy by looking at it's image name
        case 'bullet' :
            enemy.hp -= 10;
            break;

    }
    bullet.kill(); //bullet dies on impact

    if (enemy.hp <= 0)
    {
        enemy.animations.play('pop');
        this.bEmitter.x = enemy.x;
        this.bEmitter.y = enemy.y;
        enemy.bubbleSfx.play();
        this.bEmitter.start(true,2000,null,20);
        enemy.destroy();
        this.splitEnemy(enemy.nextSize , enemy.x, enemy.y);
        this.waveProperties.active -= enemy.points;

    }
};

if anyone could help me it would be greatly appreciated I'm at a loss atm.

[DaxChen]

try this:

var popAnimation = enemy.animations.add('pop', [1,2,3,4,5],30,false);
popAnimation.onComplete.add(function () {
  enemy.destroy();
})

and in

if (enemy.hp <= 0)

just call:

enemy.animations.play('pop')