JSFiddle - React, Tailwind, and code Playground

by firegroove

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/tooltipster/3.3.0/js/jquery.tooltipster.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tooltipster/3.3.0/css/tooltipster.min.css">
<p><a href="http://iamceege.github.io/tooltipster/">tooltipster website</a></p>

<p class="tooltip">paragraph</p>
<b class="tooltip">bold</b>
<div class="tooltip">div</div>
<a class="tooltip" href="#">anchor</a><br>
<span class="tooltip">span</span>

CSS

.tooltip {
    margin: 30px;
    display: inline-block;
    border: solid 1px black;
    padding: 5px 10px;
}
.tooltipster-default {
    cursor: pointer;
}
.tooltipster-default:hover {
    text-decoration: underline;
}

JavaScript

$("*").tooltipster({

	/* works: */
	/* content: ('<a href="http://www.lesite.com" target="_blank">Le site</a>'),
 */

	/* works too: */
/* content: ('<a href="http://www.lesite.com" onclick="window.open(this.href);return false">Le site</a>'), 
	  */
		
		
	content: ('Le site'), 
	  
	 
	 
	 
/* 	 content: (' href="http://www.lesite.com" onclick="window.open();return false" '),
	  
	  */
		
		
contentAsHTML: true,
    interactive: true,
    onlyOne: true,
 });