Question

im trying to hide inserted rows into a table that have the class “newrow”.

Normal rows have an add button that adds these new rows underneath them. Ive a “hide” button that when clicked i want to hide the “newrow”‘s inserted which will the rows after the table row where the button is clicked. ive tried to solve it and come up with a solution but its not working and buggy and badly written. Any ideas?

Heres my hide method

$(document).ready(function(){
    $(".hideRow").click(function(event){    

    var found;
    found=false;
    $('tr').each( function() {

        if($(this).attr('class')=='newrow'){
            $(this).hide();
            found=true;
        }
        else if(found==true && $(this).attr('class')=='row'){
            return false;
        }
    });


    }); 
});

Answer 1

Not sure what you are trying to achieve but based on what you have written this should suffice.

$(".hideRow").click(function() {
    $(this).parents("tr").nextUntil("tr:not(.newrow)").hide();        
});

Tested here.