将鼠标悬停在表上，用jquery更改另一个元素样式，只适用于1毫秒

当悬停在某个表的任何区域时，我希望文本加下划线。

这是我的代码，它只工作1密耳秒，然后下划线消失，即使光标在表内（尝试了go和foo测试）：

JS:

<script>
$(document).ready(function(){
$(function(){
    $('.foo').mouseenter(function(){
        $(".vvv").addClass('altbg')
    }).mouseout(function(){
        $(".vvv").removeClass('altbg')
    });
});
})
</script>

CSS：

.altbg {
    text-decoration:underline;
}

HTML:

<div class="go">
<table border="1" class="foo">
        <col style="width:115px;" />
        <col style="width:280px;" />
        <col style="width:125px;" />
        <col style="width:145px;" />
        <col style="width:125px;" />
        <col style="width:230px;" />
          <tr>
            <td>0</td>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
          </tr></table>
</div>
<div class="vvv">Hello</div>  

编辑：第二个相关问题：

我希望在悬停表格时更改文本颜色，即使颜色已经由ID定义。

除了将ID更改为class之外，我如何让这个div更改它的颜色？

也许为了将类指定给选择器，脚本中的某些内容需要更改，但我不知道该怎么做

JS:

<script>
$(document).ready(function(){
$(function(){
    $('td').mouseenter(function(){
        $(".vvv").addClass('altbg')
    }).mouseout(function(){
        $(".vvv").removeClass('altbg')
    });
});
})
</script>

CSS：

#meh {color:red}
.altbg {
    text-decoration:underline;
    color:blue;
}

HTML:

<div class="go">
<table border="1" class="foo">
        <col style="width:115px;" />
        <col style="width:280px;" />
        <col style="width:125px;" />
        <col style="width:145px;" />
        <col style="width:125px;" />
        <col style="width:230px;" />
          <tr>
            <td>0</td>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
          </tr></table>
</div>
<div id="meh" class="vvv">Hello</div>