jQ append 添加html 及字符串拼接

如图，我要拼接这样一段html:

点击下边添加按钮，不断添加这段Html

html:
<div class="x_addtable">
   <div class="x_zs_btn tr mt10">
         <button type="button" class="btn btn-sm f14 x_btn" id="x_btn">+</button>
         <button type="button" class="btn btn-sm f14 x_btn" id="x_btn1">-</button>
    </div>

</div>

js:
<sctipt>
//追加报告表单
   $(\'.x_zs_btn button#x_btn\').on(\'click\',function(){
        var htmladd="";
        htmladd +=\'<div class="x_add_details mb20">\';
        htmladd +=\'<input class="form-control mb20" type="text"  placeholder="请输入标题">\';
        htmladd +=\' <textarea name="" id="" rows="3" placeholder="请输入内容"></textarea>\';
        htmladd +=\' </div>\';
        $(".x_addtable").append(htmladd);
        $(\'.x_zs_btn button#x_btn1\').show()
    })
</script>