How can i link two drop down buttons added dynamically

Question

guys got a wired problem but plz help.
i m using jbuilder to create m y website.
in this i got 2 drop down buttons.
when the 1st(p1) 1 is clicked then second 1(a1) shows value respective of the value clicked in 1st 1.
i dynamically add similar drop dowm on click of a button.
but when value in the new drop down is selected (p2) it shows changes in 1st drop down (a1) not in newly created drop down(a2)
could u guys plz help me out.
its really urgent

Answer 1

this is the code i m using to create the drop down
->
var i=0;
var option=new Array();
function insRow(){
var d=document.getElementById("div");
d.innerHTML+="<select id='D"+i+"' class='input' onChange='getSh(this.selectedIndex)'><option>Select Here</option>"+
<%
rs=st.executeQuery("select * from productTab");
while(rs.next())
%>
"<option><%=rs.getString("productName")%></option>"+
<%}%>
"</select>"
d.innerHTML+="<select name='DD"+i+"' id='DD"+i+"' class='input'><option>Select Here</option></select>"
d.innerHTML+="<select name='DDD+i' id='DDD+i' class='input'><option>Select Here</option></select>"
d.innerHTML+="<input type=text name='T+i' id='T+i' class='input-time'><br>"
option +=["DD"+i];
option +=["D"+i];
i++;
function getSh(selectedcitygroup)
document.getElementById("DD+i").options.length=1
if(selectedcitygroup>0){
for(i=0;i<cities[selectedcitygroup].length; i++)
document.getElementById("DD+i").options[document.getElementById("DD+i").options.length]=new Option(cities[selectedcitygroup].split("|")[0], cities[selectedcitygroup][i].split("|")[1])