title: "This" in a draggable
body: <p>How can I get the attr of a draggable? (only the one I drag)
  ui and ui.draggable do not work. Please explain when to use each one
  I have been searching and I do not see the solution:
  <a href="http://api.jqueryui.com/draggable/#event-drag" rel="nofollow">http://api.jqueryui.com/draggable/#event-drag</a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$( ".blue" ).draggable(
    { drag: function( event, ui ) { // mentre arrossego
    //var drag = ui.position.left; //ok
    //var id = this.attr('data-id'); //no
    //var id = ui.attr('data-id'); //no
    //var id = ui.draggable.attr("data-id")//no
    $("#check").html(id);
    }  
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.blue { 
   float:left;
   display:inline-block;
   width:30px; height:30px;
   margin:10px;
   background:blue;
   cursor:pointer;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div class="blue" data-id="220"&gt;&lt;/div&gt;
  &lt;div class="blue" data-id="221"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>