Tooltip not disappearing

Question

I have jQuery tooltip activated for all elements in my page. One of those elements is an AJAX 'Submit' button that is immediately disabled (on click) and then vanishes (the div containing it is overwritten by the AJAX response)

My problem is that the tooltip continues to remain on screen even after the button is clicked/vanishes. Have tried these codes, but to no use (no all together, but any one):

$("#signup").tooltip({events: {input: 'click, blur'}});
$("#signup").tooltip("disable"); 
$("#signup").tooltip().hide(300);
$("#signup").tooltip("close");

Followed by

document.getElementById('signup').disabled=true;

And then the Ajax call.

Answer 1

You can use remove() to remove the tooltip

 $(".ui-tooltip-content").parents('div').remove();

Answer 2

I know it's an old question but I ran into the same problem where i delete the element but the tooltip does not disappear so i used the following way to solve it.

Let's say you used this to initiate the tooltips:

$('document').tooltip({
    position: {
        my: "center bottom-15",
        at: "center bottom"
    }
});

The following removes the tooltip after a click from the DOM.

$( document ).click(function() {
   $('.ui-tooltip').remove();
});

Hope this help and other people!