title: How to dynamically generate droppable/draggable/sortable div elements within a div?
body: <p>Hello so I have to parts to this question:</p>
  
  <ol>
  <li><p>I would like to be able to dynamically create div elements when a user performs an action (say, clicks a button a drags something into a droppable and create a new droppable). I'm using this code right now and it's successfully generating the css block:</p>
  
  <p>function createDiv()
  {
    var divTag = document.createElement("div");</p>
  
  <p>divTag.id = "slotclass";</p>
  
  <p>divTag.className ="connect";</p>
  
  <p>document.body.appendChild(divTag);
  }
   ... though I'm not too sure how to make it droppable/draggable/sortable after this. </p></li>
  <li><p>I'd like for the dynamically generated div element to appear within a div that has a specific id from the css stylesheet. However, when I use createDiv(), it generates it outside of the div brackets regardless of what things I've tried (such as not closing brackets or placing my button in this case within the div brackets).</p></li>
  </ol>
  
  <p>If anyone could help out with these two areas, that would be so great! Many thanks.</p>