js生成元素的事件不执行问题

要求：双击span标签，可以修改。
<div class="commands_ticketmiddl_ine_new" >
 ???<span>NO:</span><span ?name="oddNo" ?id="customerNo">${worKticket.customerNo}</span>
</div>

方案：添加onclick事件，动态增加input。

document.getElementById("customerNo").ondblclick = function(){
// ???????????????alert(11111);
 ???????????????var td = $(this);
 ???????????????var txt = $.trim(td.text());
 ???????????????var input = $("<input name=‘customerNo‘ onblur=‘test()‘ id=‘testID‘ type=‘text‘value=‘" + txt + "‘/>");
 ???????????????td.html(input);

 ???????????}
进一步要求，当鼠标输入框离开时候，弹出所填写的内容，在上边动态生成的时候写上onblur方法。
如果，$(function(){
　　　如果在这个里边，获取

$("#testID").val()；有问题，这里边涉及元素加载的问题。当双击的时候才生成此元素，但是，加载页面的时候，需要这个元素。所以报错。

});

function test(){
 ???alert(123);
 ???alert($("#testID").val());
}