JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<div id="dialog" title="Basic dialog"> <a href="http://www.jqueryui.com">
A link placed at top
</a>

    <p style="margin-bottom: 200px">This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
    <div id="toggleDiv">Toggle this</div> <a onclick="$('#toggleDiv').toggle();" id="tooltip">When clicking here i end up at the top of the dialog and my js call is never invoked</a>

</div>

JavaScript

$(function () {
     $("#dialog").dialog({
         height: 300,
         resizeable: false
     });
     $("#tooltip").tooltip({
         items: "*",
         content: function () {
             return 'test'
         }
     });

 });