JSFiddle - React, Tailwind, and code Playground

by dine

HTML

<div class="tooltips">
<a href="#" class="ttp" data-tooltip="Olar">Lalala</a>
<a href="#" class="ttp" data-tooltip="Olar 2">Lalala</a>
<a href="#" class="ttp" data-tooltip="Olar 3">Lalala</a>
</div>

JavaScript

$('.tooltips').on('mouseover', function(e){
	var $e = $(e.target);
  if($e.is('a.ttp')){
  	var $ttp = $('<div>').addClass('text').text($e.data('tooltip'));
  	$e.append($ttp);
  }
}).on('mouseout', function(e){
	$('.text').remove();
});