How to use the ```setContent``` method of Bootstrap 5.2 popper component using jQuery

Question

Can someone please show me how to call the setContent method of popper component in Bootstrap 5.2 using jQuery?

While calling the show method is as simple as $("#myElement").popper('show') the same does not seem to be the case for the setContent method which takes an object parameter.

Bootstrap documentation only give example using native DOMElement as below

// getOrCreateInstance example
const popover = bootstrap.Popover.getOrCreateInstance('#example') // Returns a Bootstrap popover instance

// setContent example
myPopover.setContent({
  '.popover-header': 'another title',
  '.popover-body': 'another content'
})

PLEASE NOTE: In the sample the const variable declared is popover, but the call is shown on a variable myPopover which adds to further confusion for a novice like me.

The documentation says Bootstrap 5.2 is independent of jQuery but can still work just like it use to with previous versions.

Many Thanks...

Answer 1

Try :

const popover = bootstrap.Popover.getOrCreateInstance('#example') 
popover.setContent({
  '.popover-header': 'another title',
  '.popover-body': 'another content'
})
popover.show()