extract html table information based on radio button checked

Question

What combination of selectors could I use to get the html text that contains
Price information in the example below. (Assume user has clicked a radio button and the Submit button)

<table border="1" id="modal_table">
<tbody>
<tr>

<td> <input type="radio" name='sub' value="509"/> </td>
<td> 509 </td>
<td class='price'> Price is $99 </td>

</tr>
<tr>

<td> <input type="radio" value="510"/> </td>
<td> 510 </td>
<td id="price"> Price is $88 </td>

</tr>
</table>

<input type='button' id='idButton2' value="Submit">

something like

myPrice = $('input[name=sub]:checked > td').html();
alert myPrice;

- get content of td cell that follows the checked radio button, or
- get content of td cell identified by id=price that follows the checked radio button

Answer 1

$('tr input[name=sub]:checked').parent().find('#price').html()

Answer 2

Great answer! I had to change parent() to parents() to get it working. Here is the code...

<script type="text/javascript">
$(document).ready(function(){

$("#myButton").click(function () {
val1 = $("td input[name='sub']:checked").parents().find('.desc').html();
val2 = $("td input[name='sub']:checked").parents().find('.price').html();
if (val1 == null){
alert("Please select one value above");
}
else{
alert(val1 + " sells for " + val2);
};
});
});
</script>
<table border=1>
<tr><td>Select</td><td>Product</td>
<td>Description</td><td>Price</td></tr><tr>
<td><input type='radio' name='sub' value='ABCDE'></td>
<td>ABCDE</td>
<td class='desc'>Product ABCDE</td>
<td class='price'>55.95</td>
</tr><tr>
<td><input type='radio' name='sub' value='GHIFK' ></td>
<td>GHIFK</td>
<td class='desc'>Product GHIFK</td>
<td class='price'>34.99</td>
</tr></table><br>
<input type='button' id='myButton' value="Click Me">