HTML菜单分隔符

Question

我有一个菜单，我想在按钮右边插入分隔符，但不想在子菜单上。 HTML：

<ul id="nav" class ="pull-right"> 

    <ul id="menu-menu1" class="sf-menu sf-vertical"><li id="menu-item-278" class="wordpress-classes"><a href="http://localhost/wordpress/">HOME</a> 
      <ul class="sub-menu"> 
       <li id="menu-item-314" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-296"><a href="http://localhost/wordpress/">Home</a></li> 
       <li id="menu-item-303" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-296"><a href="http://localhost/wordpress/?page_id=57">Products</a></li> 
       <li id="menu-item-302" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-296"><a href="http://localhost/wordpress/?page_id=63">Dreams</a></li> 
       <li id="menu-item-301" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-296"><a href="http://localhost/wordpress/?page_id=106">Vouchers</a></li> 
      </ul> 
     </li> 
     <li id="menu-item-285" class="wordpress-classes"><a href="?page_id=66">Plans</a> 
      <ul class="sub-menu"> 
       <li id="menu-item-294" class="wordpress-classes"><a href="http://localhost/wordpress/?page_id=66">Travels</a></li> 
       <li id="menu-item-293" class="wordpress-classes"><a href="http://localhost/wordpress/?page_id=103">Pricings</a></li> 
     </li> 
    </ul> 
</ul> 
</ul> 

CSS（我想插入）：

background-image: url(images/sep_menu.jpg); 
    background-repeat: no-repeat; 
    background-position: right; 

我不能创建的类，因为它们是在WordPress。这些类是这样的：

menu-item menu-item-type-post_type menu-item-object-page menu-item-294 

我该怎么办？谢谢！

Answer 1

#menu-menu1 li { 
    background-image: url(images/sep_menu.jpg); 
    background-repeat: no-repeat; 
    background-position: right; 
} 

#menu-menu1 ul li { 
    background-image: none; 
} 

Answer 2

您可以用jQuery做到这一点是这样的：

$(function() { 
    $('ul:eq(0) li').css({ 
    'background-image': 'url(images/sep_menu.jpg) right no-repeat' 
    }); 
});