title: disable (grey out) the previous row(s)
body: <p>I would like to grey out (disable) the previous row(s), every time I add a new one. Right now I could only disable the first one. Many thanks in advance. Following is what I could do so far:</p>
  
  <pre><code>&lt;head&gt;
  &lt;SCRIPTTYPE="text/javascript"&gt;
  varcount="1";
  functionaddRow(in_tbl_name){
  vartbody=document.getElementById(in_tbl_name).getElementsByTagName("TBODY")[0];
  varrow=document.createElement("TR");
  vartd1=document.createElement("TD")
  varstrHtml1="&lt;SELECTNAME=\"sel_1\"&gt;&lt;optionvalue=\"a\"&gt;a&lt;optionvalue=\"b\"&gt;b&lt;optionvalue=\"c\"&gt;c&lt;optionvalue=\"d\"&gt;d&lt;/SELECT&gt;";
  td1.innerHTML=strHtml1.replace(/!count!/g,count);
  row.appendChild(td1);
  count=parseInt(count)+1;
  tbody.appendChild(row);
  myform.sel1.disabled=true;
  }
  functiondelRow(){
  varcurrent=window.event.srcElement;
  while((current=current.parentElement)&amp;&amp;current.tagName!="TR");
  current.parentElement.removeChild(current);
  }
  &lt;/SCRIPT&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div&gt;
  &lt;formaction="#"method="POST"name="myform"&gt;
  &lt;divstyle=""&gt;
  &lt;TABLEID="mytable"name="mytable"border="1"STYLE="border-width:1pxorangedashed;background-color:#F0E68C;table-row-width:2;"&gt;
  &lt;TR&gt;
  &lt;TD&gt;
  &lt;selectsize="1"name="sel1"&gt;
  &lt;optionvalue="a"&gt;a&lt;/option&gt;
  &lt;optionvalue="b"&gt;b&lt;/option&gt;
  &lt;optionvalue="c"&gt;c&lt;/option&gt;
  &lt;optionvalue="d"&gt;d&lt;/option&gt;
  &lt;/select&gt;
  &lt;/TD&gt;
  &lt;/TR&gt;
  &lt;/TABLE&gt;
  &lt;/div&gt;
  &lt;div&gt;
  &lt;INPUTTYPE="Button"onClick="addRow('mytable')"VALUE="Add"&gt;
  &lt;/div&gt;
  &lt;/form&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>