JSFiddle - React, Tailwind, and code Playground

HTML

<a class="tooltip" data-h4="Test Tooltip" data-p="blah blah blah blah blah blah blah blah blah">
    <div class="dialog-anchor">ANCHOR</div>
</a>

JavaScript

$(function () {

    $('a.tooltip').on('click', function (e) {
        var $this = $(this);
        e.preventDefault();

        //dialog-anchor is a child of tooltip. NEXT is used when it's siblings
        $this.find('.dialog-anchor').prepend('<div class="dialog-container"><div class="tooltip-dialog"><h4>' + $this.data('h4') + '</h4><p>' + $this.data('h4') + '</p></div><div class="bg"></div></div>');
    });
});