When starting Ember application, you may wonder where to put code that will initialize Twitter Bootstrap javascript widgets. Let's say that you want to add simple popover to your page.

If you put popover element into static HTML file, the best place to initialize its functionality is in your application definition on ready event.

Ember.Application.create({
    ready: function () {
        Ember.$(".my-popover-element").popover();
    }
});

However, it won't work in Handlebars templates, because Ember renders dynamic HTML after ready event is triggered.

To fix this, you may create Ember view dedicated to display popovers, where Bootstrap function is called whenever this element is inserted into the DOM on didInsertElement event.

PopoverView = Ember.View.extend({
    didInsertElement: function () {
        this.$("button").popover();
    }
});

You can see it in use here.