Hey, I'm trying to select an element to change the background-color property of it, but I fail to select it. The script runs at http://stud.cmd.hro.nl/0794249/portfoliovx/ . In the left column, there are horizontal rules with five blue blocks to the right. When hovering over the second from the left, i want the background of the first block to change to orange as well. So far, I've written this:
<script> function rateBlokjes () { $("#primary div.meta ul li.extra div.rateblok") .filter(".1") .hover( function(){ $(this).css({ "background-color" : "#DF3913" }); }, function(){ $(this).css({ "background-color" : "#2E7FC3" }); }) .end() .filter(".2") .hover( function(){ $(this).css({ "background-color" : "#DF3913" }); $(this).parent().filter(".1").css({ "background-color" : "#DF3913" }); }, function(){ $(this).css({ "background-color" : "#2E7FC3" }); }) .end(); } </script> And the html of the bars looks like this <div class="meta"> <ul> <li>17 mei 2008</li> <li>Nog geen cijfer</li> <li>Boekbinder</li> <li class="extra"> <div class="rateblok 5"></div> <div class="rateblok 4"></div> <div class="rateblok 3"></div> <div class="rateblok 2"></div> <div class="rateblok 1"></div> </li> </ul> </div> I know the script isn't optimal, I'm planning on fine tuning it later, but for now, could someone tell my why selecting with $ (this).parent().filter(".1") doesn't work? Tnx and greetings, Jasper Kennis