Step 1. The CSS
.getval
{
text-decoration: underline;
cursor: pointer;
color: blue;
}
Step 2. the Script
function detailClick(element)
{
var detailsTd = element;
var detailsTr = detailsTd.parentNode;
var labelList = detailsTr.getElementsByTagName('label');
var str = "Name: " + labelList[0].textContent + "\n";
str += "Age: " + labelList[1].textContent + "\n";
str += "Sex: " + labelList[2].textContent + "\n";
str += "Adr: " + labelList[3].textContent + "\n";
alert(str);
}
Step 3. The HTML
<table>
<tbody>
<tr>
<td><label> Name 1</label></td>
<td><label> Age 1</label></td>
<td><label> Sex 1</label></td>
<td><label> Adress 1</label></td>
<td class = 'getval' onclick='detailClick(this);'>Details</td>
</tr>
<tr>
<td><label> Name 2</label></td>
<td><label> Age 2</label></td>
<td><label> Sex 2</label></td>
<td><label> Adress 2</label></td>
<td class = 'getval' onclick='detailClick(this);'>Details</td>
</tr>
</tbody>
</table>