How to dynamically change table data with dynamically created element?

How to dynamically change table data with dynamically created element?

As sooon as I dblclick on table(3 Rows, 3 cols) data the input text appears on that <td> with dynamically allocated ID to that input.

As soon as I update text in that input and focusout or press enter from Input text the contents should be updated inside that <td> with that input text.

html:

  1. <div id="contentsTable" align="center">
  2.     <table class="tblData">
  3.         <tr class="tblRow">
  4.         <td class="tblCol" id="td1">Item 1</td>
  5.         <td class="tblCol" id="td2">Item 2</td>
  6.         <td class="tblCol" id="td3">Item 3</td>
  7.         </tr>
  8.         <tr class="tblRow" id="td4">
  9.         <td class="tblCol" id="td5">Item 4</td>
  10.         <td class="tblCol" id="td6">Item 5</td>
  11.         <td class="tblCol" id="td7">Item 6</td>
  12.         </tr>
  13.         <tr class="tblRow">
  14.         <td class="tblCol" id="td8">Item 7</td>
  15.         <td class="tblCol" id="td9">Item 8</td>
  16.         <td class="tblCol" id="td10">Item 9</td>
  17.         </tr>
  18.     </table>
  19. </div>

js:

  1. $(document).ready(function() {       
  2.    
  3. });
  4. $(document).on('dblclick','.tblCol',function(){
  5.     var itemText = $(this).text().toString();
  6.         var id = $(this).attr('id');
  7.         $(this).html("<input type=\"text\" id=txt"+id+" class=\"txtEdit\" value=\"\" size=\"15\" />");
  8.         $('#txt'+id).focus();
  9.         $('#txt'+id).val(itemText);
  10.         $(this).unbind('dblclick');
  11. });
  12. $(document).on('focusout','.txtEdit',function(){
  13.     var id=$(this).attr('id').toString().substring(3);
  14.     alert('id :'+id);
  15.     alert("Text val : "+$(this).val());
  16.     alert(($(id).length)>0);  //returning false
  17.     alert($(id).html()); // error : undefined
  18. });


Hope you got what my problem is.

I want to know what I am doing wrong,

Thanks in advance...!