title: How to hide text in a tooltip last few seconds, after ajax call with jQuery?
body: <p>I have a link which will have a tooltip of bootstrap.
  I run an ajax call, where if the call is successful, change the tooltip text, but can not make the text disappear after a few seconds.</p>
  
  <p>Code link:</p>
  
  <pre><code>&lt;a href="" class="btn-add pull-right" data-id="1" data-toggle="tooltip" data-placement="bottom" data-original-title="Add to favs."&gt;&lt;i class="fa fa-heart-o color-icon"&gt;&lt;/i&gt;&lt;/a&gt;
  </code></pre>
  
  <p>Code ajax call:</p>
  
  <pre><code>$(document).ready(function() {
      $('.btn-add').on('click', function(e) {
          var $this = $(this);
          var data = $this.data('id')
  
          $.ajax({
             type: 'POST',
             url: '{!! url("add") !!}',
             data: { 'id' : data },
             dataType: 'JSON',
             beforeSend: function(){
                  $this.html('&lt;i class="fa fa-spinner fa-spin"&gt;&lt;/i&gt;');
             },
            success: function(data){
                  if(data.message == 'ok')
                  {
                      $this.html('&lt;i class="fa fa-heart color-icon"&gt;&lt;/i&gt;').attr("title","Added success").tooltip("fixTitle").tooltip("show");
  
                  }
            }
        })
  
          e.preventDefault();
  
      });
  </code></pre>
  
  <p>Then as I can hide the tooltip text that changed after the ajax call after a few seconds?
  I hope your friends help. Greetings From Chile.</p>
  
  <p>Solution:</p>
  
  <pre><code>  if(data.message == 'ok')
   {
      $this.html('&lt;i class="fa fa-heart color-icon"&gt;&lt;/i&gt;').attr("title","Added success").tooltip("fixTitle").tooltip("show");
        setTimeout(function(){
          $this.tooltip('hide').tooltip('disable');
      }, 3000);
  
     }
  </code></pre>