I have a Bootstrap 4.7 popover as follows. This works ok without the popover. However if I insert the id="countdown" in data-content the result is not shown. How do you fix this? Thanks a lot. PS: endTime value is just a reference, the real value is near Date().getTime().
var myfunc = setInterval(function() {
var endTime = 6666666666
var currentTime = new Date().getTime() / 1000 | 0
var seconds = endTime - currentTime
// output
document.getElementById("countdown").innerHTML = seconds + "s "
// when countdown is over
if (remaining < 0) {
clearInterval(myfunc);
document.getElementById("countdown").innerHTML = ""
}
}, 1000);<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
<div class="myinfo" data-container="body" data-toggle="popover" data-html="true" data-placement="top" data-trigger="hover" data-content='<span class="style-text-mini">Submit Time:</span>
<span id="countdown"></span>'>Div content</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script>