Javascript-форум - Присвоить разные class элементу li, какаие есть способы?

aleksandr8i,
важно ul{
position: relative;

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  ul{
    position: relative;
    margin:0 auto;
    width:200px;
  }

  li{
    float:left;
    width:50px;
    list-style:none;
  }

  .active{
    background:#00FF00;
  }

  .super{
    background:#FF3333;
  }
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
       var li = $(".bg_link"),  middle = $("ul").width()/2;
      li.hover(function(){
        var left = $(this).position().left;
        $( this ).addClass(left <= middle ? "active" : "super");
        },function(){
        $( this ).removeClass("active super");
    });
});
  </script>
</head>

<body>  <ul>
<li class="bg_link">link</li>
<li class="bg_link">link</li>
<li class="bg_link">link</li>
<li class="bg_link">link</li>
<li class="bg_link">link</li>
<li class="bg_link">link</li>
<li class="bg_link">link</li>
</ul>



</body>

</html>