项目上有的一个小需求，动态的增加和删除div，百度了一下都没看到

下面的效果图

下面是代码

<div id="appendDevelopmentNumber">

</div>



//添加

function addDevelopmentNumber() {

    $("#appendDevelopmentNumber").append('<div class="row">n' +

        '                        <div class="form-group">n' +

        '                            <label class="col-sm-4 control-label"></label>n' +

        '                            <input name="developmentNumber" data-role="maskedtextbox" type="text" style="width:100px;"n' +

        '                                   data-bind="value:model.developmentNumber"  class="k-textbox"/>n' +

        '                            <input name="developmentNumber" data-role="maskedtextbox" type="text" style="width:180px;"n' +

        '                                   data-bind="value:model.developmentNumber"  class="k-textbox"/>n' +

        '                            <button type="button" class="btn btn-default" aria-label="Left Align" onclick="addDevelopmentNumber()">n' +

        '                                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>n' +

        '                            </button>n' +

        '                            <button type="button" class="btn btn-default" aria-label="Left Align" onclick="delDevelopmentNumber(this)">n' +

        '                                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>n' +

        '                            </button>n' +

        '                        </div>n' +

        '                    </div>');

}



//移除

function delDevelopmentNumber(e) {

    console.info(e);

    console.info($(e).parent().parent());

    $(e).parent().parent().remove();

}