Why does bootstrap popover stop working?

Question

JavaScript

I'm making a book using turn.js.
Some sort of script conflict. There is a blue "i" icon, when clicked, a window with text appears (popover from bootstrap). But on the third and further page, the window stops appearing, and also, if you return to the second and first pages, then it stops working here too.
How to fix it?

Answer 1

Popups are now initialized once on the page. And at the time of initialization, there are exactly two popups on the page (open the inspector in the browser, the console and execute $('[data-toggle="popover"]').length ).
You need to subscribe to the turn.js event. Perhaps the turned event will do ( www.turnjs.com/docs/Event:_turned ):

$(function() {
    $('.flipbook').turn({
        width: 1000,
        height: 349,
        elevation: 50,
        gradients: true,
        autoCenter: true
    });

    $(".flipbook").on("turned", function() {
        var $popovers = $('[data-toggle="popover"]');
        $popovers.popover("destroy");
        $popovers.popover();
    });
});