Jquery 同一页面中具有不同样式的两个选框

我想在我的一页有两个字幕样式

一个从右向左滚动，另一个从下到上滚动

但在我的例子中，它们都是朝着同一个方向滚动的，而且它们都是同步的，这是我不想要的。下面是我的代码

<table>

<tr>
<td class="msg" align="left" width="170">Application Availability : </td>
<td>
<div class="marquee">first data to scroll right to left</div>
</td>
</tr>
</table>

如果我尝试使用下面的脚本，它们都是以较小的高度向上移动的

 $(function () {
$('.marquee').marquee({
    speed: 10000,
    gap: 50,
    delayBeforeStart: 0,
    direction: 'up'
    //,duplicated: true
});
}); 

---

给每个元素一个ID并分别初始化给每个元素一个ID并分别初始化

$(document).ready(function () {
var $diaplay = $('#display'), counter = 0;
$('.marquee')
    .bind('beforeStarting', function(){

    })
    .bind('finished', function(){
        counter++;

    })

.marquee({
    duration: 10000
})
});

 $(function () {
$('.marquee').marquee({
    speed: 10000,
    gap: 50,
    delayBeforeStart: 0,
    direction: 'up'
    //,duplicated: true
});
});