javascript form list 추가 삭제

html

<div name="problem_list" id="problem_list">
    <div id="form_input"> 
        <table class="table table-bordered"> 
             <button type="button" onclick="delForm(this);">삭제</button>
             <tr>
                 <td>각종 input</td>
             </tr>
        </table> 
    </div> 
</div>
<a href="#none" onclick="addForm();"> 질문추가</a>

<div id="list_file_tag" class="sr-only"> 
    <div id="form_input"> 
        <table class="table table-bordered">                 
             <button type="button" onclick="delForm(this);">삭제</button>
             <tr>
                 <td>각종 input</td>
             </tr>
        </table> 
    </div> 
</div>

script

        function addForm() {
            $('#problem_list').append($('#list_file_tag').html());
            check_click();
        }
        function delForm(obj){
            var div = $(obj).parent();
            //console.log(div);
            //라인 삭제
            div.remove();
        }

css

.sr-only{
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}

1.기본 폼과 동일하게 보이지 않는 태그 폼을 생성해둔다.

2.추가 버튼시 폼 리스트에 태그 폼을 추가(append)한다.

3.삭제시 버튼 클릭시 폼을 제거한다.