Binding a class to DOM setting Timeout in Ember

I have an animation working when the class "fa-counter" is added to the DOM.

I want that the animation start working after 3 seconds i land in the page. How can i control that in ember?

I have found Ember.run.later an option to use , but i struggle on how to implement it.

The code

Html

{{#if isAnimate}}
    <i class="fa fa-cog fa-fw big fa-counter"></i>
{{else}}
    <i class="fa fa-cog fa-fw big"></i>
{{/if}}

So if it isAnimate the class fa-counter makes start the animation

In my controller by default isAnimate is false

var MenuController = Ember.ObjectController.extend({
    isAnimate: false,
    startWatchingAnimation: function(controller){
        var self = this;
        Ember.run.later(function(){
          self.set('isAnimate', true);
        }, 1000);
    },
});

I have thought also to access to access the scoped JQuery object with the this.$() method.

Html

<i class="fa fa-cog fa-fw big"></i>

Controller

var MenuController = Ember.ObjectController.extend({
    isAnimate: false,
    startWatchingAnimation: function(controller){
        Ember.run.later(this, function(){
            this.$('.fa').addClass('.fa-counter');
        }, 500);
    },
});

No one of the two methods really work, how can i achieve that?