Add DIVs and remove them clicking on a link?

Using a select dropdown list and $(code).appendTo('#mydiv'); I'm able to add the html code stored in variable "code" (looks like <div开发者_开发知识库>...</div> just before the end of div mydiv.

Now in the DIVs added this way, I would like to create a link (the (-) in the attached image

used to remove the corresponding div when clicked.

Of course the number of divs to be should be limited and I do not allow to add twice the same number.

As the divs are not available when page is loaded, I cannot define a event on the not yet existing links. I found the .live() feature which seems to be a clue. Now I need to find a way to detect which link (-) is clicked in order to remove the right div.

I cannot figure out how to achieve the last point. Can someone help me here? Thank you in advance.

You could do something like this:

$('.link').live('click',function(){
    $(this).parent().remove();
});

Given you haven't posted the relevant html, I can only make assumptions. But the following will work:

$('.removeLink').live('click',
    function(){
        $(this).closest('div.dynamicallyAddedDiv').remove();
    });

This will, of course, only remove the div belonging to the class-name of 'dynamicallyAddedDiv.'

JS Fiddle demo.