Bootstrap 5 popovers, how to find index of a specific popover

Question

So I have few bootstrap 5 popovers on a page, initiated with the code below.

let popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
let popoverList = popoverTriggerList.map(function(e){return new bootstrap.Popover(e)};

I now want to close one of them if open programmatically, and I can do that with

popoverList[x].hide();

and all works fine. The question is how do I find x (index) for a given popover?

I'm getting close with this, but still not understanding how to find the element

 $.each(popoverList, function (i, v) {
    console.log(i, $(v._element).find('[aria-describedby="02-6423"]'));
});

Here is the HTML of the popover

<button type="button" class="btn btn-xs btn-warning"
        data-bs-custom-class="popover-secondary"
        data-bs-toggle="popover"
        data-bs-placement="top"
        data-bs-html="true"
        data-bs-content="<p><input type='text' class='form-control form-control-sm' value='0'></p><div class='d-flex justify-content-between'><button type='button' class='btn btn-sm btn-label-secondary popover-dismiss'>Cancel</button><button type='button' class='btn btn-sm btn-primary'>Save</button></div>"
        data-bs-original-title="Modify Item Price"
        aria-describedby="02-6423">
    <i class="bx bx-edit-alt"></i>Change
</button>

Answer 1

Ok, so I got it to work this way, but if anyone has a better solution, let me know.

$.each(popoverList, function (i, v) {
    if ($(v._element).parent().find('[aria-describedby="02-6423"]')) {
        popoverList[i].hide();
    }
});