I have a table that looks like this: ------
<div class="highest-rated"> <table> <tr> <td class="title">Lorem ipsum</td> <td class="category">Audio</td> <td class="rating">3</td> </tr> <tr> <td class="title">Foo</td> <td class="category">Video</td> <td class="rating">2</td> </tr> <tr> <td class="title">Bar</td> <td class="category">Video</td> <td class="rating">2</td> </tr> <tr> <td class="title">Hello world</td> <td class="category">Audio</td> <td class="rating">1</td> </tr> </table> </div> ------ With a little jquery magic I would like to modify the text of the rating cell and have it display an image. This should be the outcome: ------ <div class="highest-rated"> <table> <tr> <td class="title">Lorem ipsum</td> <td class="category">Audio</td> <td class="rating"><img src="images/rating-3.gif" /></td> </tr> <tr> <td class="title">Foo</td> <td class="category">Video</td> <td class="rating"><img src="images/rating-2.gif" /></td> </tr> <tr> <td class="title">Bar</td> <td class="category">Video</td> <td class="rating"><img src="images/rating-2.gif" /></td> </tr> <tr> <td class="title">Hello world</td> <td class="category">Audio</td> <td class="rating"><img src="images/rating-1.gif" /></td> </tr> </table> </div> ------ The number of table rows may vary on different pages. How should I do this...? Regards, Per