jQuery：追加可移动div

Question

我希望能够点击一个按钮，添加一个包含另一个按钮，可以点击删除所述div的div。

function addPanel(name) { 
    var outer = $("<div id='" + name + "'>"); 
    var inner = $("<button>"); 
    inner.click(function() { 
     $("'#" + name + "'").remove(); 
    }); 

    outer.append(inner); 

    $("#someotherdiv").append(outer); 
} 

当我调用这个函数时，它使用按钮放置新的div。当我点击（新）按钮时，我收到一条错误消息：“＃名称”未定义。使用javascript/DOM调试器（chrome）我可以看到新的div存在但未被正确评估为选择器。

我觉得这是非常基本的东西，但我似乎无法得到我的头。

编辑 - 错字脚本固定 - 不是从原来的

---

编辑

function addPanel(name) { 
 
    var outer = $("<div id='" + name + "'>" + name + "</div>"); 
 
    var inner = $("<button>Delete</button>"); 
 
    inner.click(function() { 
 
    $("#" + name).remove(); 
 
    }) 
 

 
    outer.append(inner); 
 

 
    $("#someotherdiv").append(outer); 
 
} 
 

 
addPanel('div2'); 
 
    
 
$("#addButton").click(function() { 
 
     addPanel('div1'); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> 
 

 
</script> 
 
<div id="someotherdiv"> 
 
    Main div 
 
</div> 
 
<button id="addButton">add</button>

Answer 1

的问题是用单引号。在按钮的点击事件结束时，您还错过了)。尝试如下。

function addPanel(name) { 
 
    var outer = $("<div id='" + name + "'>" + name + "</div>"); 
 
    var inner = $("<button>Delete</button>"); 
 
    inner.click(function() { 
 
    $("#" + name).remove(); 
 
    }) 
 

 
    outer.append(inner); 
 

 
    $("#someotherdiv").append(outer); 
 
} 
 

 
addPanel('div1'); 
 
addPanel('div2');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="someotherdiv"> 
 
    Main div 
 
</div>