[BHy4ok]

Здравствуйте все!
Выручайте устал уже читать и искать выход
Есть html

<div class="s1">
                <div class="s2">
                <div class="p1">
                <ul class="subMenus">
                 <li><a href="#">Sub menu 1 item 1</a></li>
                 <li><a href="#">Sub menu 1 item 2</a></li>
                 <li><a href="#">Sub menu 1 item 3</a></li>
                 <li><a href="#">Sub menu 1 item 4</a></li>
          </ul>
</div>

                 <div class="p1">
                <ul class="subMenus">
                 <li><a href="#"></a></li>
                 
          </ul>
</div>
                 <div class="p1">
                 <ul class="subMenus">
                 <li><a href="#">Sub menu 3 item 1</a></li>
                 <li><a href="#">Sub menu 3 item 2</a></li>
                 <li><a href="#">Sub menu 3 item 3</a></li>
                 <li><a href="#">Sub menu 3 item 4</a></li>
          </ul>
</div>
                
                            
               
                </div>
            </div>

Нужно чтобы при наведении на <li> другие <li> затемнялись и затемнялся .p1

Вот этот код работает но только если все li под одним <ul> и <div>, мне данный вариант не подходит так как слетит другой скрипт

$(document).ready(function(){


$(function() {      
        $("ul.subMenus  li").css("opacity","1.0");       
        $("ul.subMenus  li").hover(function () {     
                $(this).siblings().stop().animate({opacity: 0.5}, 

"slow");   
        },          
        function () {      
                $("ul.subMenus  li").stop().animate({opacity: 1.0}, 

"slow");       
        });   
});


});

Прошу вашей помощи