HTML5: Can't drag on-the-fly created <div> tag even though draggable='true' Do I need to "BLESS" it or something?

After creating a div on the fly with this markup:

$('.circuit').prepend("<div class='component' draggable='true'>TRANSISTOR</div>");

It is NOT draggable itself :(

Is jQuery prepend() the correct way to create "live" tags in the DOM?

Do I need to somehow bless it a different way to make draggable=true really work?

How to I wire it up so that 开发者_JAVA技巧on-the-fly divs can be draggable?

AFTER NOTE: I added a static div and that is draggable. INTERESTING: I view both the static and dynamic using FireFox F12 Firebug and they are identical. But one is draggable and one is not!!!

If it's not in markup when the page is rendered, the browser isn't binding them based just off having the attribute (when created dynamically) quite yet (maybe in future releases this will happen). For now, you need to rig up these events manually when creating a draggable element on the fly.

See here for how to do it using jQuery & FireFox: HTML5 drag and drop in Firefox 3.5