JQuery избавиться от подчеркивания: hover?

Question

Я только начал работать с jQuery, у меня возникли небольшие проблемы.

Получил таблицу миниатюр, и я хочу, чтобы каждая ячейка была выделена, когда я наводил курсор на изображение внутри нее.Эта часть работает.Но я также хочу, чтобы изображение внутри ячейки не имело подчеркивания - оно унаследовано от таблицы стилей a:hover{text-decoration:underline}.Это то, где я застрял, я не думаю, что устанавливаю правильные вещи.

Мне нужно использовать встроенные стили, поэтому мой jQuery выглядит так:

$('[name*=thumb]').hover(
  function () {
    //as we hover over an item, change it's background, attempt to vaquish pesky underline
    $('#' + $(this).attr('id').replace('thumb', 'thumbcontainer')).css('background-color', '#cccccc'); 
    $('#' + this).css('text-decoration', 'none');  //doesn't work : (
  },
  function () {
    //fix bgs of items we're not hovering on
    $('#' + $(this).attr('id').replace('thumb', 'thumbcontainer')).css('background-color', '#ffffff'); 
  }
);

Мой HTML выглядит следующим образом:

<td name="thumbcontainer8" id="thumbcontainer8"><a href="#" name="thumb8" id="thumb8"><img src="..." /></a></td>
<td name="thumbcontainer9" id="thumbcontainer9"><a href="#" name="thumb9" id="thumb9"><img src="..." /></a></td>

Answer 1

Разве это правило в вашей таблице стилей не поможет?

a:hover img{text-decoration:none}

Answer 2

А как же:

  $(this).css('text-decoration', 'none');