JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://github.com/jquerytools/jquerytools/raw/master/src/tooltip/tooltip.js"></script>
<div id="info0" class="info">
  <p>stuff stuff</p>
  <p>stuff stuff</p>
</div>

<div id="info1" class="info">
  <p>stuff stuff</p>
  <p>stuff stuff</p>
</div>

<div id="info2" class="info">
  <p>stuff stuff</p>
  <p>stuff stuff</p>
</div>

CSS

.info {
    display: none;
    background: #000;
    color: #fff;
}

#div2{
    position: absolute;
    top: 200px;
}

JavaScript

var div1 = $("<div/>"),
    div2 = div1.clone();

$.each("HAfFfqiYLp0 24Tc4Qie5Y8 NJTvf9hrKVY".split(" "), function(i, id){
  var img1 = $("<img/>").attr("src", "http://i.ytimg.com/vi/"+id+"/default.jpg"),
      img2 = img1.clone();
  
  img1.tooltip({
    position: "bottom center",
    tip: "#info" + i
  }).appendTo(div1);
  
  img2.attr("title", "heyoo heyoo").tooltip({
    position: "bottom center"
  }).appendTo(div2);
});

div1.attr("id", "div1").appendTo("body");
div2.attr("id", "div2").appendTo("body");