js/jquery+css自定义弹出框出现问题，在弹出方法前面给Html代码赋值之后弹出的内容无值。

问题遇到的现象和发生背景

我自己写了一个弹出层方法，可以弹出表单输入框进行新增修改；我是弹出一串html代码，这串代码是在本页面隐藏着的，在修改弹窗的时候，我需要给这个html代码中的表单赋值，然后调用弹出方法，方法中是获取这段html代码插入到弹出框中，但是我弹出之后一直没有值。

问题相关代码，请勿粘贴截图

<div class='update-role-div'>
<input type="hidden" name="id" id="role-id"/>
<input type="text" class="qk-form-input" id="role-name" name="name" placeholder="请输入角色名称"/>
<input type="text" class="qk-form-input" id="role-memo" name="memo" placeholder="请输入角色描述说明"/>
</div>

$("#role-id").val(cells[0].id);
$("#role-name").val(cells[0].name);
$("#role-memo").val(cells[0].memo);
qk.open({
   title:"修改角色",
   type:1,
   content:$(".update-role-div"),
    area:{w:'400',h:'300'},
});

运行结果及报错内容

弹出框是可以弹出，但是内容无值

我想要达到的结果

类似于layer.open()方法

1、打印下cells[0].name
2、尝试先弹出再赋值