title: Jquery Draggable does not work for dynamic content
body: <p>I have been trying to build a CMS where the contents are generated automatically and they must be draggable. For this, I have used Jquery UI to make the elements move to other positions. </p>
  
  <p>The problem is that when I generate content dynamically, the jquery's draggable functionality does not work. I generated some divs dynamically with Jquery and I wish that these divs can be draggable but when I try to do it using jquery the content does not move.</p>
  
  <p>If the content is not generated dynamically (static content), then the draggable works.</p>
  
  <p>This is my Jquery Code:</p>
  
  <pre><code>$("#btnAddTextsBlog").click(function() {
      var texts = $("#blog_text").val();
      var content2 = "&lt;div id='text1' class='ui-widget-content' style='float: left; margin-left: 30px; margin-right: 30px; margin-top: 30px; display: block;'&gt;&lt;p style='font-size: 18px;'&gt;" + texts + "&lt;/p&gt;&lt;/div&gt;";
      $("#main_col_blog_results").append(content2);
  });
  
  $(".ui-widget-content").draggable();
  </code></pre>
  
  <p>HTML CODE:</p>
  
  <pre><code>&lt;div class="row" id="main_row_blog_results"&gt;
     &lt;div class="col-md-12" id="main_col_blog_results"&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I want to make the dynamic content of the page be <code>draggable</code>, any suggestion of where the error may be? How could the <code>draggable</code> dynamic content be made?</p>