jQuery get all table rows until class

Question

I am having a table rows from db via ajax and I have this sample:

<tr class="header packagesTR expand">
   <td>                             
      Boxing Amateur
   </td>
   <td>
      0                                                     
   </td>                                                        
   <td width="20%"><button type="button" class="btn btn-warning pull-left showInclude"><i class="fa fa-minus"></i></button>
   </td>
</tr>
<tr>
   <td>                             
       Sparring Fee 
   </td>
   <td>
      0                                                     
   </td>                                                        

</tr>
<tr>
   <td>     
      Water
   </td>
   <td>
        0                                                       
   </td>                                                        
</tr>
<tr class="header packagesTR expand">
   <td>     
      <input type="hidden" name="category" value="packages">
    <input type="hidden" name="PK" value="2">                           
       Muay Thai Amateur
   </td>
   <td>
    0                                                       
   </td>                                                        
 </tr>

When I clicked on the ".showInclude" button, I want to get the current table row and the next table rows until the next class name "header".

I am able to get the current table, by:

 $(this).closest('tr.header').html();

How can I iterate through each table row until the next class?

Answer 1

i clicked on the ".showInclude" button, i want to get the current table row and the next table rows until the next class name "header".

You can use .nextUntil() along with .add() to add current row header in collection:

var closesrthr= $(this).closest('tr.header');
closesrthr.nextUntil('.header').add(closesrthr).nextUntil('.header').html();

How i can iterate through each table row until the next class?

You have the object of rows current row .header and rows until next first sibling .header. you can iterate over them using each:

var closesrthr= $(this).closest('tr.header');
closesrthr.nextUntil('.header').add(closesrthr).each(function(){
    //do stuff
});

Working Demo