js多个<ul>相应不同的点击事件

$('ul').on("click","li#left",function(){
            currentProvince = $(this).text().replace(/[0-9]/ig,"");
            $(this).siblings().removeClass('choose');
            $(this).addClass('choose');
            refreshTypeByProvince(currentProvince);
            refreshOrderCountByProvinceAndOrderType(currentProvince,currentOrderType);
            refreshUserOrderInfoByProvinceAndOrderType(currentProvince,currentOrderType);
});

$('ul').on("click","li#bottom",function(){
            currentOrderType = $(this).text().replace(/[0-9]/ig,"");
            $(this).siblings().removeClass('choose');
            $(this).addClass('choose');
            refreshOrderCountByProvinceAndOrderType(currentProvince,currentOrderType);
            refreshUserOrderInfoByProvinceAndOrderType(currentProvince,currentOrderType);
});

页面中有多个<ul>，现在想要不同的<ul>中<li>标签点击相应不同的事件。

同一<ul>下的<li>设置相同的id,上述代码中的left、bottom即为<li>的id。

这样就能各自响应各自的事件了。

0228更新

感觉一个ul下边的每个li都设置一样的id不太好。。，还是给ul加个id吧。。。如下

$('yourULID').on("click","li",function(){
            currentOrderType = $(this).text().replace(/[0-9]/ig,"");
            $(this).siblings().removeClass('choose');
            $(this).addClass('choose');
            refreshOrderCountByProvinceAndOrderType(currentProvince,currentOrderType);
            refreshUserOrderInfoByProvinceAndOrderType(currentProvince,currentOrderType);
});