title: Using JQuery on JavaScript variables
body: <pre><code>$.getJSON('ajax_popup.php', function(data)
  {
      var popupDiv = decodeURIComponent(data.data);
      $('body').append( popupDiv );
  });
  </code></pre>
  
  <p>This piece of code returns <code>&lt;div&gt;</code> element that has other XHTML elements inside. It is returned in JSON format with JQuery. The returned XHTML from <code>data.data</code> is stored into JavaScript variable by first decoding UTF-8 encoded data. The DIV element is a custom popup window. The above code works, BUT I want to make it draggable using JQuery UI's .draggable() method, but I don't know where to use it and how to make it work in this case.</p>
  
  <p>I've tried:</p>
  
  <pre><code>popupDiv.draggable();
  </code></pre>
  
  <p>But it didn't work.</p>
  
  <p>And:</p>
  
  <pre><code>$('body').append( popupDiv ).draggable();
  </code></pre>
  
  <p>But it made the body element draggable :D</p>