Bootstrap Component: Popover

<h3>Popover Example</h3>  
<button type="button" class="btn btn-primary" data-bs-toggle="popover" title="Popover Header" data-bs-content="Some content inside the popover">
    Toggle popover
</button>
<button type="button" class="btn btn-primary" data-bs-toggle="popover" title="Popover Header 2" data-bs-content="Some content inside the popover 2">
    Toggle popover 2
</button>
<script>
// Initialize popovers when document is ready
document.addEventListener('DOMContentLoaded', function() {
    // Select all elements with popover attribute
    const popoverElements = document.querySelectorAll('[data-bs-toggle="popover"]');
    
    // Initialize popover for each element
    popoverElements.forEach(element => {
        new bootstrap.Popover(element);
    });//edn foreach
});//end addEventListener
</script>