JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-tooltip.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<li>
            <a href="gogole.it" rel="tooltipBOTTOM" class="tooltipBOTTOM top-link" data-original-title="<strong>Ideas</strong>" id="asd">
              <i class="icon icon-white icon-asterisk" >
              </i>BOTTOM
            </a>
          </li>
<li>
<a rel="tooltipTOP" data-original-title="WOWO" href="gogole.it>">
  TOP
</a>
</li>

JavaScript

$("*").tooltip({
    selector: "*[rel=tooltipTOP]",
    placement: "top",
    trigger: "hover"
});
$('*,.tooltipBOTTOM,.top-link').tooltip({
    selector: "*[rel=tooltipBOTTOM]",
    placement: "bottom",
    trigger: "hover"
});