JSFiddle - React, Tailwind, and code Playground

by TJ VanToll

HTML

<div id="noChange" title="Click to change title (ajax call)">If click me, my title DOESN'T change</div>
<div id="change" title="Click to change title (ajax call)">If click me, my title change</div>

JavaScript

$( "[title]" ).tooltip();

$("#noChange").click( function() {
    var $div = $(this);
    $.ajax({
        url: "/echo/json",
        success: function() {
            $div.tooltip( "option", "content", "changed!");
        }
    });
});

$("#change").click( function() {
    var $div = $(this);
    $.ajax({
        url: "/echo/json",
        beforeSend: function() {
            // I must hide before ...
            $div.hide();
        },
        success: function() {
            // ... and then re-show the element
            $div.attr("title", "changed!").show();
        }
    });
});