Question

i have this html markup and i want to select some rows using jQuery.

When pressing the button with class ‘cerrar’ i want to select the 3 tr with class ‘hidden’ before the same button

 <tr class='main'>
            <td class='table-sub-title'> 
                Test
            </td>
            <td class='table-sub-title'>
                Test
            </td>
            <td class='table-sub-title'>
                Test
            </td>
            <td class='table-sub-title'>
                Test
            </td>
        </tr>
        <tr class='hidden'> <!-- ********* Select this <tr> ********* -->
            <td class='noborder'>
                Test
            </td>
            <td class='noborder'>
                Test
            </td>
            <td class='noborder'>
                Test
            </td>
            <td class='noborder'>
                Test
            </td>
        </tr>
        <tr class='hidden'> <!-- ********* Select this <tr> ********* -->
            <td class='noborder'>
                Test
            </td>
            <td class='noborder'>
                Test
            </td>
            <td class='noborder'>
                Test
            </td>
        </tr>
        <tr class='hidden'> <!-- ********* Select this <tr> ********* -->
            <td class='noborder'>
                Test
            </td>
            <td class='noborder'>
                Test
            </td>
            <td class='noborder'>
            </td>
            <td class='noborder'>
                <input type='button' name='Cancelar' value='Cancelar' class='cerrar' />
            </td>
        </tr>
        <tr class='main'>...
    <!-- Repeat -->

Answer 1

You can just do like this:

$('.cerrar').click(function(){

    // Get all the tr's with hidden class before button
    var TRs = $(this).closest('tr').prevUntil("tr.main").andSelf();

});