Mouse over effect with jQuery in richfaces datatable and datascroller combo

I'm problem with defining a mouse over effect for my datatables. I have

<a4j:form>
    <rich:dataTable id="dataTable"> ... </rich:dataTable>
    <rich:datascroller id="dataScroller" for="dataTable" />
</a4j:form>

<rich:jQuery selector="#dataTable tr" query="mouseover(function(){jQuery(this).addClass('active-ro开发者_如何学Gow')})"/>
<rich:jQuery selector="#dataTable tr" query="mouseout(function(){jQuery(this).removeClass('active-row')})"/>

which are working fine on the very first page. However if I use the datascroller to goto another page, the mouseover effect is gone.

I've tried reRendering the table or the jQuery components, that didn't help with the problem at all.

Any suggestion on how I can get this working?

Not sure if this will work but its worth a try. I have never used richfaces, but jQuery live events bind to all elements including future elements appended to the DOM.

<rich:jQuery selector="#dataTable tr" query="live('mouseover', function(){jQuery(this).addClass('active-row')})"/> 
<rich:jQuery selector="#dataTable tr" query="live('mouseout', function(){jQuery(this).removeClass('active-row')})"/>