'Trouble finding table rows with multiple classes in JQuery each loop and conditionally applying classes above them
I'm having trouble using JQuery to find rows with an error class within a table then apply the error class to specific rows above it as well. I'm currently selecting all of the tables on the page with the 'Program' class, then looping through them using '.each' to find any child rows that have the 'error-rowXC' class, and if they do exist I want to then apply the same error class to the parent rows. Can anyone tell me why the variables I have here aren't finding the TR elements with both classes within each table?
let programTables = $('table.Program');
programTables.each(function(){
//these variables aren't finding anything even though they exist
let bucketErrors = $(this).find('tr.ExTotals.error-rowXC');
let subBucketErrors = $(this).find('tr.ExSubRowR.error-rowXC');
let subSubBucketErrors = $(this).find('tr.ExSubSubRowR.error-rowXC');
if(bucketErrors.length >= 1){
$(this).find('tr.ExTotal').addClass('error-rowXC');
$(this).find('tr.ExTotalB').addClass('error-rowXC');
}
});
These tables / rows are setup in a tiered structure sort of like this:
ProgramTable
|-Totals
|-SubRow
|-SubSubRow
|-Totals ('needs the error class applied')
|-SubRow ('needs the error class applied)'
|-SubSubRow ('doesn\'t need error class')
|-SubSubRow.error-rowXC
|-SubRow
|-SubRow
|-SubSubRow
I'd like to find Totals, SubRows, or SubSubRows with the error class, then apply the same error class for it's parent row without impacting rows that don't have bad data.
Any insight is much appreciated.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
