使用jquery的动态复选框

Question

我想创建一个具有动态复选框的表单，当用户单击该按钮时，该表单将在前一个表单之后添加相同的表单。我已经尝试了很多，但没有得到它，我也尝试了克隆方法，我每次我得到的形式，当我点击按钮，但它不能点击。有人能帮上忙吗？

下面是我的JS

$('#check-type').click(function(){
    $('.multiple-choice').show();
    var sth = $('.multiple-choice:first').clone().appendTo('.container');
    $('.multiple-choice:last').hide();
});

和我的HTML

<button id="check-type" value="Multiple choice">Multiple choice</button>
<div class="container"></div>
<form class="multiple-choice">
    <div id="choice" class="css-selectbox">
        <h3 id="title" name="question-title" class="first-header">Choice</h3>
        <p class="label-checkboxitem">Which features did you like?</p>            
        <input id="check1" onclick=uncheck(this) type="checkbox" name="check" value="check1" class="input-checkboxitem">  
        <label for="check1">Materials</label>
        <br> <br> 
        <input id="check2" onclick=uncheck(this) type="checkbox" name="check" value="check2" class="input-checkboxitem">  
        <label for="check2">Exam Method</label>
        <br><br>             
        <input id="check6" onclick=uncheck(this) type="checkbox" name="check" value="check6" class="input-checkboxitem">
        <label for="check6">None</label>
    </div>
</form>

Answer 1

隐藏last元素有什么原因吗？

只需注释这一行，代码就会为我运行。

DEMO

Answer 2

您需要使用以下代码

$('#check-type').click(function () {
    $("#choice").clone().prependTo(".multiple-choice");
});

您也可以在http://jsfiddle.net/Y538U/上查看代码