jQuery имитирует эффект парения при нажатии и удаляет эффект парения при нажатии на другой элемент

Question

Я пытаюсь заставить всплывающую подсказку оставаться, когда пользователь щелкает (выбирает) поле, и она должна скрываться при нажатии на другое окно.

Чтобы лучше понять, это должно работать как выбираемые опции, которые имеют всплывающую подсказку, подсказка должна оставаться, когда пользователь нажимает (выбирает опцию), и когда щелкает другое окно только подсказка другого поля должен остаться.

То, как я сделал острие кончика, было объявлено

  $(this).mouseleave(function(){
    $(this).mouseover();
  })

Но звучит так, как будто я не могу удалить его из элемента после того, как я объявил его, поэтому всплывающая подсказка никогда не скрывается.

Смотрите мой полный фрагмент ниже:

jQuery(".box").tooltip();

jQuery(".box").click(function(){
  $(this).mouseleave(function(){
    $(this).mouseover();
  })
});

.box {
  width: 50px;
  height: 50px;
  display: inline-block;
  background-color: lightblue;
  margin: 5px;
  transition: 0.5s ease-in-out;
}
.box:hover {
  background-color: lightpink;
 }

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script>

<div class="box" title="box 1"></div>
<div class="box" title="box 2"></div>
<div class="box" title="box 3"></div>
<div class="box" title="box 4"></div>
<div class="box" title="box 5"></div>
<div class="box" title="box 6"></div>