I'm new to jQuery and jQuery UI. I'm trying to move a div from a parent div to another. So far, My "article" is draggable. The "droppable" stock properly identifies the article as it's move above it, but I can't seem to find how to attach this article to the stock .
I think I'm manipulating a "div encapsulating in a jQuery object", but I'm a bit lost here.
<div id="shelf" class="shelf">
<div class="article">article</div>
</div>
<div id="stock" class="stock">
</div>
Then I have a script that's meant to add the article to the stock div, and remove it from the shelf div:
<script>
$('.article').draggable();
var stockArea = $('#stock').droppable();
stockArea.bind( "drop", function(event, ui) {
if ($(this).find(".article")){
console.log('appending ' + ui);
$(this).append(ui);
}
});
</script>
Am I doing this wrong? Thanks,