JSFiddle - React, Tailwind, and code Playground

by mathiasfcx

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<a href="#" data-toggle='tooltip' data-placement="right" data-original-title="Exemplo 1">
    Exemplo 1
</a>
<br>
<a href="#" data-toggle='tooltip' data-placement="right" data-original-title="Exemplo 2">
    Exemplo 2
</a>
<br>
<a href="#" data-toggle='tooltip' data-placement="right" data-original-title="Exemplo 3">
    Exemplo 3
</a>
<br>
<a href="#" data-toggle='tooltip' data-placement="right" data-original-title="Exemplo 4">
    Exemplo 4
</a>
<br>
<a href="#" data-toggle='tooltip' data-placement="right" data-original-title="Exemplo 5">
    Exemplo 5
</a>

CSS

body{
  margin-top:120px;
}

JavaScript

$('[data-toggle="tooltip"]').tooltip({
    animation: true,
    trigger: 'manual'
});

var temToolTip = $('[data-toggle="tooltip"]');
temToolTip.click(function() {
      temToolTip.not(this).tooltip('hide');
      $(this).tooltip('show');
});