jQuery table navigation using relative selectors only

Question

Given a table such as the following:

  <tbody>
        <%foreach (var book in Model.Books)
          { %>
        <tr>
            <td>
                <%: book.Title %>
            </td>
            <td>
                <%= book.AuthorsToLinks("MyBooks/List") %>
            </td>
            <td>
                <%: book.Genre.GenreName %>
            </td>
            <td>
                <input type="hidden" value="<%: book.Review.Rating %>" />
            </td>
            <td>
                <div class="bookRating">
                </div>
            </td>
            <td>
                <%= Html.ActionLink("Edit" , "Edit", new {bookID = book.BookID}, new { @class = "editBook"}) %>
            </td>
        </tr>
        <%} %>
    </tbody>

How the Sam Hill do I select the hidden input value above the "bookRating" div?

I think I've tried every combination of prev() / parent() / children() / next() , etc., and I'm completely out of patience.

Thanks.

Update:

Here is my JS that isn't working:

$('.bookRating').raty({
    start: $(this).parent('td').prev('td').children('input').val(),
    readOnly: true
});

I am trying to insert a rating for each row, as you can see. $(this) is apparently the problem. Anyone know why?

Answer 1

$('.bookRating').parent('td').prev('td').children('input').val();

Should do.

---

I don't think you can't use this in that function to refer to the object that called the function. Given that there might be multiple .bookRating, you probably need to iterate through each of them separately (I'm not sure how your plugin works):

$('.bookRating').each(function(){
    $(this).raty({
        start: $(this).parent('td').prev('td').children('input').val(),
        readOnly: true
    });
});