JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://onehackoranother.com/projects/jquery/tipsy/javascripts/jquery.tipsy.js"></script>
<link rel="stylesheet" href="http://onehackoranother.com/projects/jquery/tipsy/stylesheets/tipsy.css">
<a class="tipsy1" href="#" title="Tipsy">TipsyLink</a>
<a class="tipsy1" href="#" title="Tipsy">TipsyLink</a>
<a class="tipsy1" href="#" title="Tipsy">TipsyLink</a>
<br />
<a class="tipsy2" href="#" title="Tipsy">TipsyLink</a>
<a class="tipsy2" href="#" title="Tipsy">TipsyLink</a>
<a class="tipsy2" href="#" title="Tipsy">TipsyLink</a>
<br />

JavaScript

// this works
$(".tipsy1").tipsy({live:true,fade:true});

// this doesn't
$(".tipsy2").each(function(){
   // I'm doing some other logic here before I call .tipsy()
   $(this).tipsy({live:true,fade:true});
});

// add new tipsy element (ok)
$(document.body).append('<a class="tipsy1" href="#" title="TipsyAjax">AjaxTipsy1</a><br/>');

// add new tipsy element (not ok)
$(document.body).append('<a class="tipsy2" href="#" title="Tipsy">TipsyLink</a>');