Home/ Questions/Q 7617031
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-31T03:02:35+00:00

I’m looking to change the background-color for ALL cells with class=bg when hovering ANY

  • 0

I’m looking to change the background-color for ALL cells with class=”bg” when hovering ANY cell with class=”bg”.

Hours of stuff like $('.bg').hover().css("background-color","blue"); and trying out
with .each(), .mouseover(), and even .siblings() (although i think that’s entirely off the mark) but no result. 

    <head>
    <style type="text/css">
        .bg { background-color:red; }
                    .bg:hover { background-color:blue; }
    </style>
    </head>

    <body>
    <table width="100" border="1" cellspacing="0" cellpadding="0">
         <tr>
              <td class="bg">a</td>
              <td class="bg">a</td>
              <td class="bg">a</td>
         </tr>
         <tr>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
         </tr>
         <tr>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
         </tr>
    </table>
    <br />
    <table width="100" border="1" cellspacing="0" cellpadding="0">
         <tr>
              <td class="bg">a</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
         </tr>
         <tr>
              <td class="bg">a</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
         </tr>
         <tr>
              <td class="bg">a</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
         </tr>
    </table>
    </body>
    </html>

EDIT: After kumiau’s working solution I realized that what I’m looking for is far more complex. This is the page I’m working on. Hovering over ANY Hole 1 cell in either of the dark grey sections and ALL Hole 1 cell background-colors change.

Now, that page only shows 1 game type (Fourball Best Ball) with 1 round (Dubin/Kosakewitsch
VS Dybkjær/Larsen), but there will be 3 types (Fourball Best ball, Foursomes, Singles), with 6 rounds each, with 18 holes each. That’s 324 holes! See last year’s tournament here.

So, ahem, that changes things quite a bit. I’m thinking that I could class every hole cell similarly (simply, class=”hole”) and store the HoleID in a data attribute (something like data-hole-id=”fbb_1_4″ for Fourball Best Ball, Round 1, Hole 4), in order to make a more general jQ function??

EDIT 2: Got the last bit answered here jQuery selector madness

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team
    $('.bg').hover(
  function(){
    $('.bg').css({"background-color":"blue"});
  },function(){
    $('.bg').css({"background-color":"white"});
});

    updated your fiddle: http://jsfiddle.net/kumiau/Nkdny/3/

    • 0