重置jquery对象

Question

我在项目中遇到了一些设计缺陷。在这个项目中，我将一些变量初始化为jqu​​ery对象。

var $overlay = $('<div id = "overlay"/>');

目的是只有一个叠加，所以我认为将它分配给变量会更容易。我有添加类的函数，html到它等等。还有能力通过jquery删除它

$overlay.remove();

我从未考虑过的是，如果我想再次使用新信息或属性显示叠加层，那么应用于此div的任何类或html仍将存在。如何“重置”此变量？

我做了这个jsfiddle来演示我可以使用的两种方法。

$ box类似于我的$叠加问题，如果你改变它的颜色，销毁它，然后重新制作它，它将仍然有这种新的颜色。我知道这主要是一个设计缺陷，但如果没有办法，我会重新设计..

http://jsfiddle.net/mLnmbkhj/10/

Answer 1

如何重新初始化？

$('#destroyBox').on('click', function () {
    $box.remove();
    $box = $('<div id="box"/>');
    // Would like to somehow reset the box object
});

Answer 2

如果我了解您的问题，您是否可以添加点击事件以留下叠加层？在这种情况下，.detatch（）你想要的元素。