CODEWITHSUNDEEP
javascriptjqueryhtml
user12011474
user12011474

Reputation:

How to attach a object to a dynamically added element in JQuery

I'm using Bootstrap 4 popover like so:

$('[data-toggle="popover"]').popover({
    trigger: 'hover'
});

But now in jquery, I'm dynamically adding an element.

var leaveUser = $('.popover').clone().prependTo('.new-popups');

But the .popover() is not taking affect for this new dynamicly added element. How do I get it to work?

Upvotes: 1

Views: 45

Answers (1)

George
George

Reputation: 36794

The following:

$('[data-toggle="popover"]').popover({
    trigger: 'hover'
});

Will only match elements that are currently in the DOM, which your clone is not.

You will need to either use this selection and method after cloning, or call the method explicitely on your new element after cloning it:

var leaveUser = $('.popover')
    .clone()
    .prependTo('.new-popups')
    .popover({
        trigger: 'hover'
    });

Upvotes: 1

Related Questions