Сопоставьте два массива с условием

Question

У меня есть таблица без td/th-id/classes, и я прохожу через таблицу, чтобы получить данные из td: s. Если нет данных или данных: «-», то я устанавливаю класс CSS на этом td. Например:

$('.simpletable td').each(function() { 
if($(this).text() === '-') 
    { 
    $(this).addClass("nodata"); 
    } 
}); 

Однако мне нужно сопоставить это 'td' с соответствующим 'th', чтобы установить тот же CSS-класс. Я получаю массив для th-массива с:

$('.simpletable th').each(function() 
{ 
    tableheaders.push($(this).text()); 
}); 

Кто-нибудь знает, как достичь этого? Или есть более простой способ сделать все это, если я начну с нуля?

Эта таблица имеет несколько строк 'th', поэтому я не могу сделать что-либо с колонками.

MARKUP HTML:

<table class="simpletable"> 
<thead> 
    <th>th1</th> 
    <th>th2</th> 
    <th>th3</th> 
</thead> 
<tbody> 
    <tr> 
     <td>data 1</td> 
     <td>-</td> 
     <td>data 3</td> 
    </tr> 
<thead> 
<th>th4</th> 
<th>th5</th> 
<th>th6</th> 
</thead> 
<tr> 
    <td>data 4 row 2</td> 
    <td>-</td> 
    <td>data 6 row 2</td> 
</tr> 
</tbody> 

Answer 1

Вы должны захватить индекс td затем использовать .filter(), чтобы получить соответствующий th, которые имеют один и тот же индекс столбца

$('.simpletable td').each(function() { 
if($(this).text() === '-') 
    { 
    $(this).addClass("nodata"); 
    var ind = $(this).index(); // get td index relative to it's row 
    $('.simpletable th').filter(function(i,v){ 
     return $(v).index() == ind; // only return th with same column index as the td 
    }).addClass('nodata'); 
    } 
});