JQ使用append后,原有的内容消失

问题

原页面
图片说明
执行JQ,想在 规格参数 后(同一行,第二个td)插入input。结果, 规格参数整行消失!!!
图片说明

jsp代码,使用了easyui

****
商品类目:选择类目
商品标题:
商品卖点:
商品价格:
库存数量:
条形码:
商品图片:上传图片
商品规格:
商品描述:

JQ

var data=[{"group":"主体","params":["书名"]}];
$.each(data,function(i,e){
var temple = $(".group_name").clone();
$(".params").find("ul").append(temple);
temple.find("input").val(e.group);
});

请各位亲帮忙看看,第一次发帖子,来学习了。

jsp代码为

 <form id="itemAddForm" class="itemForm" method="post">
        <table cellpadding="5">
            <tr>
                <td>商品类目:</td>
                <td>
                    <a href="javascript:void(0)" class="easyui-linkbutton selectItemCat">选择类目</a>
                    <input type="hidden" name="cid" style="width: 280px;"></input>
                </td>
            </tr>
            <tr>
                <td>商品标题:</td>
                <td><input class="easyui-textbox" type="text" name="title" 
                    data-options="required:true" style="width: 280px;"></input></td>
            </tr>
            <tr>
                <td>商品卖点:</td>
                <td><input class="easyui-textbox" name="sellPoint" 
                    data-options="multiline:true,validType:'length[0,150]'" 
                    style="height:60px;width: 280px;"></input></td>
            </tr>
            <tr>
                <td>商品价格:</td>
                <td><input class="easyui-numberbox" type="text" name="priceView" 
                    data-options="min:1,max:99999999,precision:2,required:true" />
                    <input type="hidden" name="price"/>
                </td>
            </tr>
            <tr>
                <td>库存数量:</td>
                <td><input class="easyui-numberbox" type="text" name="num" 
                    data-options="min:1,max:99999999,precision:0,required:true" /></td>
            </tr>
            <tr>
                <td>条形码:</td>
                <td>
                    <input class="easyui-textbox" type="text" name="barcode" 
                        data-options="validType:'length[1,30]'" />
                </td>
            </tr>
            <tr>
                <td>商品图片:</td>
                <td>
                     <a href="javascript:void(0)" class="easyui-linkbutton picFileUpload">上传图片</a>
                     <input type="hidden" name="image"/>
                </td>
            </tr>
            <tr class="params">
                <td>商品规格:</td>
                <td>
                    <ul>
                        <li><a href="javascript:void(0)" 
                            class="easyui-linkbutton addGroup">添加分组</a>
                        </li>
                        <!-- 加入 参数 -->
                    </ul>
                </td>
            </tr>
            <tr>
                <td>商品描述:</td>
                <td>
                    <textarea style="width:800px;height:300px;visibility:hidden;" name="desc"></textarea>
                </td>
            </tr>
        </table>
        <input type="hidden" name="itemParams"/>
    </form>

你的页面 没有这个class 啊 group_name

对不起。复制漏了。

jsp代码都在同一文件下的

 <div class="hide groups_name">
    <li class="group_name"><input ></li>
</div>

图片说明
我给你 添加分组 加了一个 onclick事件

但是 还是 有问题 第一次 加一个 第二次 加两个