jquery实现表格中悬停背景色和选中行变色

HTML代码

 <table id="msgtable" class="fixed_headers table  table-bordered " >
          <thead>
            <tr>
              <th ><s:text name="smsc.sigtrace.seq" /></th>
              <th><s:text name="smsc.sigtrace.module" /></th>
              <th><s:text name="smsc.sigtrace.event" /></th>
              <th><s:text name="smsc.sigtrace.eventdesc" /></th>
              <th><s:text name="smsc.sigtrace.direction" /></th>
              <th><s:text name="smsc.sigtrace.time" /></th>
            </tr>
          </thead>
          <tbody>
          </tbody>
        </table>

CSS代码

<style>
.tr_hover{background-color:#47C240} /* 鼠标悬停上的背景色 */
.selected{background-color: #51b2f6} /* 选中行变色 */
</style>

js代码

$(document).on('messageReceived',function(e, data){
	try{
	    $.each(data, function(i, rowData){
	       $('#msgtable').messageTable('appendData', [rowData]);
	    });
	}catch(ex){
		JSTOOL.debug(ex);
	};

	//鼠标滑动，行色变化
	$('tr:gt(0)').mouseover(function(){
		$(this).addClass('tr_hover');           //通过jQuery控制实现鼠标悬停上的背景色，无视标题行用:gt(0)
	}).mouseout(function(){
		$(this).removeClass('tr_hover');       //通过jQuery控制实现鼠标悬停上的背景色
	});

	//选中行变色
	$(function () {
		$('tbody>tr').click(function () {
			$(this).addClass('selected')      //为选中项添加高亮
					.siblings().removeClass('selected')//去除其他项的高亮形式
					.end();
		});
	});
});