Here’s an easy way to hide Bootstrap tooltips onclick. Useful for focusable elements that do not change the current document’s location.

document.querySelectorAll('[data-bs-toggle="tooltip"], .add-bs-tooltip').forEach(element => {
	new bootstrap.Tooltip(element)
	
	element.addEventListener('click', event => {
		bootstrap.Tooltip.getInstance(event.currentTarget).hide()
	})
})

Bonus: Our .add-bs-tooltip selector is for eliminating the need to wrap other Bootstrap elements that already have the data-bs-toggle attribute (modals, dropdowns, etc). 😉