Jquery динамически создаваемые сбрасываемые элементы не работают

Question

Ну, привет, ребята, я разработал страницу для создания перетаскивания форм, но у меня возникли проблемы с удалением внутренних элементов, например:

<div class="container">
   <div classs="row"> <! - I drop here -!> </ div>
   <- Content is dropped here! : '(-!>
</ div>

Вот мой Javascript:

        $(document).ready(function(){

                $( "#a .row-element" ).draggable({ 
                    revert: "invalid",
                });

                $(  "#a .span2-element" ).draggable({ 
                    revert: "invalid",
                });

                $(".row").droppable({
                    accept: '.span2-element',
                    activeClass: "ui-state-hover",
                    hoverClass: "ui-state-active",
                    greedy: true,
                    drop: function(event, ui) {
                        $('<div class="span2"></div>"').appendTo(this);
                    },
                    activate: function(event, ui) {
                        $(ui.helper).draggable({ revert: "valid"});
                    }
                });

                $(".container").droppable({
                    accept: '.row-element , .span2-element',
                    activeClass: "ui-state-hover",
                    hoverClass: "ui-state-active",
                    greedy: true,
                    drop: function(event, ui) {
                        $('<div class="row"></div>"').appendTo(this);
                    },
                    activate: function(event, ui) {
                        $(ui.helper).draggable({ revert: "valid"});
                    }
                });
        });

Мне кажется, что вновь созданный элемент не dropavel ...:/

Какие-либо предложения?! заранее спасибо!

Answer 1

Прежде всего, убедитесь, что ваш HTML-код:

<div class="container">
   <div class="row"></div>
</div>

Тогда, почему у вас есть:

$('<div class="span2"></div>"').appendTo(this);

У тебя должно быть:

 $('<div class="span2"></div>').appendTo(this);