I'm trying to dynamically create and remove items from a list, it
works just fine... sort of, I can remove items, and create items, but
once an item has been created, I cannot remove it again, but I can
remove the items present when the page loads.

Here is my code

    <div class="list">
        <div class="item">
            <input type="text" value="" /> <a href=""
class="removeitem">Remove this item</a>
        </div>
        <div class="item">
            <input type="text" value="" /> <a href=""
class="removeitem">Remove this item</a>
        </div>
        <a href="" class="additem">Add item to list</a>
    </div>

    <script type="text/javascript">
    // Add item to list
    $('.additem').click(function(){
        var template = $($(this).prev().get(0)).clone();
        template.insertBefore($(this));
        return false;
    });

    // Remove item from list
    $('.removeitem').click(function(){
        $(this).prev().parent().remove();
        return false;
    });
    </script>

I can remove the 2 original items, but when I create new ones, they
cannot be removed

Reply via email to