JSFiddle - React, Tailwind, and code Playground

by Imabot

HTML

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<button type="button" 
        class="my-popover btn btn-lg btn-danger" 
        data-toggle="popover" 
        title="Popover title" 
        data-content="Initial content"
        >
        Click to toggle popover
</button>

JavaScript

// Initialize all popovers
$(function () { $('[data-toggle="popover"]').popover() })

// When the popover is show
$('.my-popover').on('show.bs.popover', function () {
  // Update popover content
  //$(this).attr('data-content', 'New content');
  $(this).pop('data-content', 'New content');
})