title: Uncaught TypeError: $(...).tooltip is not a function error
body: <p>I'm trying to use this code with those tooltips. In this link: <a href="https://jqueryui.com/tooltip/#custom-style" rel="nofollow">Code with tooltip</a>. In fact I just copied the whole code but it's now working. 
  I get an error that says <code>Uncaught TypeError: $(...).tooltip is not a function error</code>:</p>
  
  <pre><code>&lt;link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"&gt;
  &lt;script src="//code.jquery.com/jquery-1.10.2.js"&gt;&lt;/script&gt;
  &lt;script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="/resources/demos/style.css"&gt;
  
  &lt;script&gt;
    $(function() {
      $(document).tooltip({
        position: {
          my: "center bottom-20",
          at: "center top",
          using: function(position, feedback) {
            $(this).css(position);
            $("&lt;div&gt;")
              .addClass("arrow")
              .addClass(feedback.vertical)
              .addClass(feedback.horizontal)
              .appendTo(this);
          }
        }
      });
    });
  &lt;/script&gt;
  </code></pre>
  
  <p>What is missing here? </p>
  
  <p>Edit:</p>
  
  <pre><code>&lt;script&gt;
  jQuery( document ).ready(function( $ ) {
     $('.hasTooltip').tooltip();
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Using it like this, solved my problem!</p>