I'm a newbee. I want to create a collapsable ul. But I want each
visible li (including both parent li and child li's ) to alternate the
background color. The problem is that when I apply the background to
the parent, all of the child li's do not change color they inherit the
parent color. I am using the following code to make this happen...

<html>
<head>
<script type="text/javascript" src="jquery-1.2.6.js"></script>
<script type="text/javascript">
$(document).ready( function() {
   $('li.stripeable:even').addClass('greenbar');
});
</script>
<style>
.greenbar {
    background-color:#EEEEEE;
}
ul {
   list-style-type: none;
}
.stripeable {}
</style>
</head>
<body >
   <ul >
       <li class="stripeable" >
          11111 (4 dates)
         <ul>
            <li class="stripeable">
               date1
            </li>
            <li class="stripeable">
               date2
            </li>
            <li class="stripeable">
               date3
            </li>
            <li class="stripeable">
               date4
            </li>
         </ul>
      </li>

       <li class="stripeable">
          11112 (3 dates)
         <ul>
            <li class="stripeable">
               date1
            </li>
            <li class="stripeable">
               date2
            </li>
            <li class="stripeable">
               date3
            </li>
         </ul>
      </li>

       <li class="stripeable">
          11113 (3 dates)
         <ul>
            <li class="stripeable">
               date1
            </li>
            <li class="stripeable">
               date2
            </li>
            <li class="stripeable">
               date3
            </li>
         </ul>
      </li>
   </ul>
</body>
</html>

Reply via email to