[jQuery] Re: Appended element is not draggable

After append new tag, you have to bind the draggable() event again...

On Jan 28, 1:42 am, Mircea <i...@amsterdamsat.com> wrote:
> Hi
> I have a container div with some spans. I had set the spans to be
> dragable and I want to do a function that on click will append a new
> span to my container and make it also draggable.
>
> I manage to append the new span in #selectable container but it is not
> draggable.
>
> My code is:
>
> <script type="text/javascript">
> $(function() {
>                 $("span").draggable();});
>
> </script>
>
> <script type="text/javascript">
>  $(document).ready(function(){
>         $("#selectable").click(function(){
>                  $("#selectable").append("<span>The new span</span>");
>         });
>
> });
>
> </script>
>
> and the markup is:
> <div id="selectable">
> <div class="ui-widget-content" style="width: 800px; height: 500px;
> background:#ccc;">
>         <span class="text draggable">Item 1</span>
>         <span class="text draggable">Item 2</span>
>         <span class="text draggable">Item 3</span>
>         <span class="text draggable">Item 4</span>
>         <span class="text draggable">Item 5</span>
>         <span class="text draggable">Item 6</span>
>     <span class="clone">Clone</span>
>     <p class="clone">a p replaced</p>
> </div>
> </div>
>
> Thank you.