I try to add new raw in  table and rename the input field name in div, the id updated, but name doesn't updated and select filed not work for new raw. Thanks for any suggestions. Here is the sample:

 

<script type="text/javascript" src=" http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
 
$(document).ready(function() {

  $("#item_no1").click(function() {
    var row = $('#mytable tbody>tr:last').clone(true).insertAfter('#mytable tbody>tr:last');
    var index = $("#mytable tbody>tr").length;
    var myselectChange ="nmselectChanged(this, "  + index + ')'
//    var myselectChange ="nmselectChanged(this.options[this.selectedIndex].value,"  + index + ')'

    alert (myselectChange);
  
    $("td:eq(0)", row).text(index);
    $("td:eq(1) input", row).attr("name", "item_no" + index).attr("id", "item_no" + index).attr("value", "" )
    $("td:eq(2) div", row).attr("id", "otherNameType_" + index)
    $("td:eq(2) div", row).children(".fname").sttr("id", "fname"+ index).attr("name", "fname"+ index);

    //$("td:eq(2) div:mname", row).attr("id", "mname"+ index).attr("name", "mname"+ index);
    //$("td:eq(2) div:lname", row).attr("id", "lname"+ index).attr("name", "lname"+ index);
    $("td:eq(2) SELECT", row).attr("name", "item-opt" + index).attr("id", "item-opt" + index).attr("onchange", myselectChange );
 
    //$("#mytable").append(row); //add the row back to the table row
 
    return false;
  });

$('#item-desc1').click(function() {
   $('#item_no1').click();
});

 

});
 
function popup() {
 
var tbl = document.getElementById("mytable");
    alert(tbl.innerHTML   )
}

function nmselectChanged(listObj, id ) {

   var val =listObj.options[listObj.selectedIndex].value;
   var obj =document.getElementById("otherNameType_"+id);
   alert("nmselectChanged val="+ val + ", id="+id)
 
  if (obj !=null) { 
    if(val == "01"){
    obj.style.display = 'block';
     }else{
     obj.style.display = 'none';
    }

  }
 
}
 
 
</script>
 

<table id="mytable" border="0" align="left" cellpadding="2" cellspacing="1" bgcolor="#999999">
  <thead>
    <tr>
      <th bgcolor="#ecf6fc" scope="col">No.</th>
        <th bgcolor="#ecf6fc" scope="col">Description</th>
    <th bgcolor="#ecf6fc" scope="col"   width=500 >Option</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td bgcolor="#ecf6fc" align="center">1</td>
      <td bgcolor="#ecf6fc"><input name="item_no1" type="text" id="item_no1"  value="abcd"  /></td>
      <td bgcolor="#ecf6fc">
<SELECT name="item-opt1" id="item-opt1" onchange="nmselectChanged(this, 1)";>
<OPTION VALUE="00">close
<OPTION VALUE="01">Resume
 
</SELECT>
<div id="otherNameType_1" style="display:none;" class="otherNameType">
<input type="text" name="fname" size='15' id='fname' value='first' >
<input type="text" name="mname" size='10' id='mname' value='middle' >
<input type="text" name="lname" size='20' id='lname' value='last'  >

<input type="text" name="suffix" size='4'  >
</div>
</td>
</tr>
   
  </tbody>
</table>
 
<input type="button" onclick="popup()" value="popup">