Selecting multiple divs in html

Question

How do we hover over multiple div in html at the same time?

I have two divs at different positions in a html page.

I want to hover on any of divs and it, and the other div to get selected.

How can I accomplish it using preferably css properties only? currently its going from parent to child not the vice versa,i tried all different combinations. even ~ and + properties.

html code:

<div id=one1>
<div id=two2></div>
</div>

css:

#one1:hover { background-color: yellow;}
#two2:hover { background-color: yellow;}

Answer 1

Did you mean something like this Fiddle

#one:hover ~ #two , 
#one:hover ~ #three  
{ background-color: yellow; }

Answer 2

If you have a structure similar to the one below, all you have do is add specific styles to the child div on .parent:hover:

<div class="parent">
  <div class="child"></div>
  <div class="child"></div>
</div>

css

.parent:hover .child{your style goes here}

Answer 3

Jquery Solution using toggleClass

$(document).ready(function() {
  $('.box').click(function() {
    $('.box').toggleClass('green');
  });
});

HTML

<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>

CSS

.box {
    width:100px;
    height: 100px;
    border:1px solid grey;
    display: inline-block;
}

.green {
    background-color: lightgreen;
}

JSfiddle Demo