Add 'dim' class until particular DOM element

Add 'dim' class until particular DOM element

Hello,

I have a rather simple problem (I think) but can't seems to find a simple solution.

I have a table and one of the cells has a 'today' class. 

  1. <table>
  2.       <tr>
  3.             <td>1</td>
  4.             <td>2</td>
  5.       </tr>
  6.       <tr>
  7.             <td class="today">3</td>
  8.             <td>4</td>
  9.       </tr>
  10. </table>
Now I have to add a 'dim' class to all the cells before '.today', that's it :) Of course, the table is dynamic (it is a calender).

My solution was to get the index of 'td.today' and then slice all table cells until the index, but $('td.today').index() returns '0' since it is the first element in that particular table row ...

Can anyone provide a simple solution?

Thanks!

Christophe