Re: [jQuery] Superfish - Different colors for each menu column

.sf-menu li.green:hover, .sf-menu li.green.sfHover,
.sf-menu li.green a:focus, .sf-menu li.green a:hover, .sf-menu li.green a:active {
	background:		#CFDEFF;
	outline:		0;
}

I'm trying to come up with an approach to assign a different color scheme for 
each main group (column).

ie:
<ul class="sf-menu sf-vertical">
   <li>
	 # Menu1 
   </li>	
   <li class="red" >
       #a Menu2 
         <ul >
            <li class="red">
	         #aa Menu2-subitem1 
	    </li>
           <li class="red">
	         #aa Menu2-subitem2 
	    </li>
          </ul >
    </li>
</ul>               

and 

Superfish.css is:

.
.
.
.sf-menu li {
	background:		#BDD2FF;
}
.sf-menu li.green {
	background:		#00AA00;
	}
.sf-menu li.red {
	background:		#AA0000;
	}

.sf-menu li li {
	background:		#AABDE6;
}
.sf-menu li li.green {
	background:		#00AA00;
}
.sf-menu li li li {
	background:		#9AAEDB;
}

BUT HOW DO I use class of green or red here?
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:		#CFDEFF;
	outline:		0;
}
                

--------------------
Any help is appreciated