javascript - how can apply some jquery stuff only based on header row -


i have table this

<table>  <thead>    <th>id </th><th>name </th><th>number </th><th>result </th>  </thead>         <tbody> <tr>  <td>stuff</td>  <td>stuff</td>  <td>stuff</td>  <td>stuff</td>  </tr> </tbody>  </table> 

i want add class = "red" td header result

so result column jquery dynamically when page loads.

you can index of header using .index() apply class using :nth-child selector.

jsfiddle

enter image description here

var resultheaderindex = $('th:contains("result")').index(); $('td:nth-child(' + (resultheaderindex + 1) + ')').addclass('red') 

if wanted add class header can add before index:

jsfiddle

enter image description here

var resultheaderindex = $('th:contains("result")')     .addclass('red')     .index(); $('td:nth-child(' + (resultheaderindex + 1) + ')').addclass('red') 

Comments