JSFiddle - React, Tailwind, and code Playground

HTML

<a class="tooltip" title="Easy as 123" href="#">ABC</a><br /><br /><br /><br /><a class="tooltip" title="StackOverflow" href="#">SO</a>

<div id="tooltip"></div>

CSS

body{padding-top:30px;}
#tooltip{display:none;position:absolute;}

JavaScript

$(document).on({
    mouseover: function() {
        var $this = $(this),
            tooltip = $this.attr('title'),
            thisPos = $this.offset();
        $('#tooltip').html(tooltip).css({
            'left': thisPos.left,
            'top': thisPos.top - 20
        }).show();
    },
    mouseout: function() {
        $('#tooltip').hide().empty();
    }
}, '.tooltip');