Question

I have some markup:

    <table>
    <tbody>
        <tr>
            <td>
                <input type="hidden" class="deleted" value="False" />
                <input type="button" class="rtButton" value="RT" />
            </td>                               
        </tr>
        <tr>
            <td>
                <input type="hidden" class="deleted" value="False" />
                <input type="button" class="rtButton" value="RT" />
            </td>                               
        </tr>
        <tr>
            <td>
                <input type="hidden" class="deleted" value="False" />
                <input type="button" class="rtButton" value="RT" />
            </td>                               
        </tr>
    </tbody>
</table>

What I’m wanting to happen is when an rtButton is clicked the value of just the hidden input within the same td is changed to true.

I tried to achieve this with:

$(function(){

    $('.rtButton').click(function () {
        $(this).closest('input.deleted').val("True");
        alert( $(this).closest('input.deleted').val())
            });


});

However it can’t seem to set the value.

Answer 1

You can use siblings() method:

Adding demo anyways: http://jsfiddle.net/qZBkt/3/

$(function(){
    $('.rtButton').click(function () {
        $(this).siblings('input.deleted').val("True");
    });
});

closest() gets the first element that matches the selector, beginning at the current element and progressing up through the DOM tree.