emberjs didRender not working

I want to start some css transition when my page is fully loaded(including all background images), so I am trying didRender event of a component but its never getting called.This is how my codes look like

export default Ember.Component.extend({
    didRender() {
        console.log('did render working');
        var home =$('#main-outlet')[0];
        home.className += " homePage";
        startTimer(5);
    },
    willDestroyElement() {
        console.log("destroying view");
        var home = $('#main-outlet')[0];
        home.className = " wrap";
    }
});

However,when I use didInsertElement event my code works fine but I cant use as it is executed before getting loading the images itself Any idea or an alternative approach on this?