现有一jsp页面，其中有两个div，div中各有一个表格，第二个表格初始不显示。第一个表格中的数据来源于数据库。当点击第一个表格某行中的按钮时，显示被隐藏的div，同时将第一个表格中被点击按钮所在行某些的数据显示在第二个表格中的某些text中。附上处理的函数代码，求大佬告诉怎么能实现，最好是有个例子。
//第一个表格
<table id="table_show" border="1" cellspacing="0" cellpadding="2">
<tr><td>用户名</td><td>地址</td><td>电话</td><td>申请理由</td><td></td></tr>
<%
Connection dbCon=dbcon.getConnections();//连接数据库
Statement stmt=dbCon.createStatement();
String sql="select * from app where determine='0'";//查询语句
ResultSet rs = stmt.executeQuery(sql);//将查询到的数据放入result set中
while(rs.next()){
%>
<tr bgcolor=cyan>
<td id="yhm"><%=rs.getString(1) %></td>
<td id='dz'><%= rs.getString(2) %></td>
<td id="tel"><%= rs.getString(3) %></td>
<td id='ly'><%= rs.getString(4) %></td>
<td><input name="one" type="button" value='审批' /></td>
</tr>
<%
}
rs.close();
stmt.close();
dbCon.close();
%>
</table>
//第二个表格
<table>
<tr><td>用户名：</td><td><input type="text" name="YHM" id="YHM"></td></tr>
<tr><td>地区：</td><td><input type="text" name="DQ" id="DQ"></td></tr>
<tr><td>请选择级别：</td><td>
<select name="DJ">
<option></option>
<option>办事处</option>
<option>一级</option>
<option>二级</option>
<option>三级</option>
</select></td></tr>
<tr><td>联系方式：</td><td><input type="text" name="Tel" id="Tel"></td></tr>
<tr><td><input type="submit" value="添加"></td></tr>
</table>
function cc(){
var bb=document.getElementById("table_show").getElementsByTagName("tr");
for(var j=0;j<bb.length;j++){
var aa=bb[j].cells;
for(var i=0;i<aa.length-2;i++){
aa[4].onclick= function(){
//显示第二个表格
function openDialog(){
document.getElementById('light').style.display='block';
document.getElementById('fade').style.display='block';
}
openDialog();
//不论点击的是第几行的按钮，都会返回第一行id=yhm格的值（可能是因为我每行固定列的id都相同吧）
document.getElementById('YHM').value = document.getElementById('yhm').innerHTML;
//不论点击的是第几行的按钮，返回的都是最后一行下标为3的格的值
document.getElementById('Tel').value = aa[3].innerHTML;
}
}
}
}
