0

I want to load the contents of the gallery element to the stage element by clicking on the gallery element itself. This is noob stuff I'm sure, but I have yet to find an explanation for this. Why doesn't this work?

Also, I am using jquery UI to create a drag and drop interface --> the element inside the #gallery is draggable, and #gallery is droppable

$(document).ready(function () {
    var $galcon = $('#gallery').html();
    $("#gallery").on('click'function () {
        $('#stage').append($galcon);
    });
});
Jason P
  • 26,984
  • 3
  • 31
  • 45
Harley McKee
  • 3
  • 5
  • You're missing a comma between `'click'` and `function` – Stryner Aug 26 '14 at 21:13
  • when you want to use HTML tags, use `html()` method. When you are referring to jQuery nodes, use `.append()`. i.e either drop `.html()` from "`$('#gallery').html()`" or change `.append()` to `.html()` in "`$('#stage').append($galcon)`". Refer [here](http://stackoverflow.com/questions/3015335/jquery-html-vs-append) for a detailed discussion on the same. – jjk_charles Aug 26 '14 at 21:15

3 Answers3

0

Reference the actual node child and not just the html. In other words, remove the ".html()"

$(document).ready(function () {
    var $galcon = $('#gallery');
    $("#gallery").on('click'function () {
        $('#stage').append($galcon);
    });
});
KJ Price
  • 5,774
  • 3
  • 21
  • 34
0

Try replacing var $galcon = $('#gallery').html() with var $galcon = $('#gallery').text(). Hope this helps!

Zak
  • 1,910
  • 3
  • 16
  • 31
0

Are you getting an error in the dev console? Is this the exact code you're running? You need a comma after 'click': 

$("#gallery").on('click', function () {
    $('#stage').append($galcon);
});
Shawn Flahave
  • 501
  • 4
  • 13