[jQuery] accessing child element without unique id
I'm trying to access a td text value, as shown in the javascript
below. The easiet way to solve this problem would be to give each td
id value a unique identifier (i.e. td id="row1_col1") Is it possible
to access the td element of a tr with a unique tr id tag without
naming each td id uniquely? I'm new to this, I pasted the code as an
example of what I'm trying to do. All the attempts in the javascript
below failed.
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<table cellspacing="5" cellpadding="5" border="1">
<tr id="row1">
<td id="col1">1</td>
<td id="col2">2</td>
</tr>
<tr id="row2">
<td id="col1">3</td>
<td id="col2">4</td>
</tr>
</table><br />
<script type="text/javascript">
str01 = $("#row1 > col1").text();
document.write("row1 col1 value is: " + str01 + "<br />");
str02 = $("#row1.col1").text();
document.write("row1 col1 value is: " + str02 + "<br />");
//str03 = $("#row1").("#col1").text();
//document.write("row1 col1 value is: " + str03 + "<br />");
//str04 = $("#col1").text(("#row1").text());
//document.write("row1 col1 value is: " + str04 + "<br />");
</script>
</body>
</html>