Using jQuery for JavaScript Variables

Question

$.getJSON('ajax_popup.php', function(data)
{
    var popupDiv = decodeURIComponent(data.data);
    $('body').append( popupDiv );
});

This piece of code returns an element <div>that has other XHTML elements. It is returned in JSON format using jQuery. The returned XHTML from data.datais stored in a JavaScript variable by first decoding UTF-8 encoded data. The DIV element is a custom popup. The above code works, BUT I want to make it draggable using JQuery UI.draggable (), but I don't know where to use it and how to make it work in this case.

I tried:

popupDiv.draggable();

But that did not work.

and

$('body').append( popupDiv ).draggable();

But this made the body draggable element: D

Answer 1

Try the following:

$(popupDiv).draggable();

Answer 2

jQuery DOM jQuery. :

$.getJSON( 'ajax_popup.php', function( data ) {
  var popupDiv = decodeURIComponent( data.data );
  $('body').append( $(popupDiv).draggable() );
} );

Answer 3

To convert a javascript variable to a jquery object, use $() See javascript variable for jQuery object