jQuery：动态创建div并删除它

我很恼火，因为我意识到在这个论坛上解决方案就在我眼前。 寻找一种方法来点击一个div.a，为每个div.a点击创建一个具有随机背景的div.B。我希望通过再次单击此分区a来删除创建的分区B。如果可能的话，我希望在同一个项目上多次单击，创建的div的背景是不同的，但如果它保持现在的状态，我不会感到困扰。 我就在这里：

html：
`
css:
身体{
背景色：#508090；
文本对齐：居中；
边距：自动；}
#区域{
边框：绿色；
宽度：100%；
身高：100%；
位置：绝对位置；
顶部：0px；
左：0px；
z指数：1；
}
#包裹{
背景颜色：蓝色；
保证金：0自动；
宽度：继承；
高度：自动；
位置：绝对位置；
顶部：15px；
左：15px；
不透明度：0.5；
z指数：1000；
}
#布依{
宽度：900px；
高度：自动；
位置：相对位置；
}
.内容{
背景色：透明；
位置：相对位置；
边框：#F00实心；
溢出：隐藏；
高度：100px；
边缘顶部：15px；
宽度：100%；
}
titre先生{
背景色：#FFFF00；
浮动：左；
高度：20px；
光标：指针；
宽度：10%；
}
.邮政{
背景色：#FFFFFF；
浮动：左；
最大高度：0；
溢出：隐藏；
保证金：1px；
位置：相对位置；
宽度：100%；
}
carre先生{
背景颜色：绿色；
高度：200px；
宽度：20px；
}
.含糊不清{
不透明度：0.2；
位置：绝对位置；
宽度：100%；
身高：100%；
z指数：-10；
排名：0；
左：0；
}
jquery（1.8.3）：

jQuery（文档）.ready（函数（$）{

$（“.content”）。每个（函数（）{
变量
$content=$（这个），
$title=$content.find（“.titre”），
$post=$content.find（“.post”）；
var计数器=1；
var randomColors=[“绿色”、“黄色”、“红色”、“蓝色”、“橙色”、“粉色”、“青色”]；
var len=randomColor.length；
var randomNum=Math.floor（Math.random（）*len）；
//从数组中删除颜色，因此不能再次使用
RandomColor.拼接（randomNum，1）；
$title.toggle（函数（）{
var id=this.id；
$post.animate（{maxHeight:'150px'}，400）；
$（''）.addClass（'vague'+id+counter++）.css({
//“背景色”：“白色”，
“背景色”：RandomColor[randomNum]，
“不透明度”：“1”，
'位置'：'绝对'，
“宽度”：“100%”，
“高度”：“100%”，
“z指数”：“1000”，
“顶部”：“0”，
“左”：“0”
}).附于（“#area”）；
}, 
函数（）{
$post.animate（{maxHeight:'0'}，200）；
}
);
$title.单击（函数（）{
$（this）.delay（200）.toggleClass（'active'）；
});
$（'.titre.active'）。单击（函数（）{
var$back=$（'body'）.find（'area'）.find（':first child'）；
$back.animate（{opacity:'0'}，200）；
$back.remove（）；
});
});
});

我一直在删除创建的div。 放纵一点，我只是一个试图玩魔术的平面设计师。这不是一个命令，我开始和所有的评论，或包含信息的文档链接，或信息位是欢迎的！

---

多谢各位

DOM中不存在动态内容。所以在“Document.ready（function（）{…}）；”中填充内容我抓不住它

相反，尝试使用委托的函数查找生成的内容。这里有一个一般的例子

$('.parent-that-generated-content-is-in').on('click', '#id-content',function(){
    $(this).hide(); 
});

---

很难看出您在代码中的位置..但这正是您要寻找的。下面是一些伪代码：

var$div=createMyDiv（）$div.remove（）。这里有一个小问题：为什么你想添加/删除这些元素而不是显示/隐藏它们？首先，这是因为我会尝试将这个系统放在一个网站中。我想在创建的div中添加一个随机背景img，如果所有帖子都打开了，他可以撰写草稿，如果所有帖子都关闭了，他可以创建一个空的背景。所以我需要“刷新”背景，或者其他什么，但它似乎更容易创建和销毁，不是吗？
    $(".content").each(function () {
        var
                $content = $(this),
                $title = $content.find(".titre"),
                $post = $content.find(".post");
                var counter = 1;
        var randomColors = ["green","yellow","red","blue","orange","pink","cyan"];
        var len = randomColors.length;
        var randomNum = Math.floor(Math.random()*len);
            //Removes color from array so it can't be used again
            randomColors.splice(randomNum, 1);


            $title.toggle(function() {
                var id = this.id;
                $post.animate({maxHeight:'150px'}, 400);
                $('<div/>').addClass('vague'+id+counter++).css({
                    //'background-color': 'white',
                    'background-color': randomColors[randomNum],
                    'opacity': '1',
                    'position': 'absolute',
                    'width': '100%',
                    'height': '100%',
                    'z-index':'1000',
                    'top' : '0',
                    'left' : '0'
                    }).appendTo('#area');
                }, 
                function () {
                    $post.animate({maxHeight:'0'}, 200);
                }
            );

            $title.click( function () {
                $(this).delay(200).toggleClass('active');
            });
            $('.titre.active').click( function () {
                var $back = $('body').find("#area").find(':first-child');
                $back.animate({opacity:'0'}, 200);
                $back.remove();
            });


        });
    });

$('.parent-that-generated-content-is-in').on('click', '#id-content',function(){
    $(this).hide(); 
});