JavaScript отображает дочерний div при наведении курсора

Question

У меня есть следующий HTML:

<div id="wrapper">
    <div onmouseover="displayDiv()">  <div id="thisIsTheDivToDisplay"></div   </div>
    <div onmouseover="displayDiv()">  <div id="thisIsTheDivToDisplay"></div>  </div>
    <div onmouseover="displayDiv()">  <div id="thisIsTheDivToDisplay"></div>  </div>
    <div onmouseover="displayDiv()">  <div id="thisIsTheDivToDisplay"></div>  </div>
</div>

Я хочу отобразить div внутри, когда я mouseover его parent div, Но я не могу использовать идентификаторы, потому что число div является случайным (зависит от значений в базе данных). Есть ли способ в JavaScript, чтобы отобразить этот единственный ребенок div (в зависимости от div Я при наведении курсора)?

Answer 1

Почему вам нужно использовать JS? это может быть решено с помощью CSS. вот скрипка с рабочим примером

<div class="lol">
    <div>lol</div>
</div>

<div class="lol">
    <div>lol</div>
</div>

<div class="lol">
    <div>lol</div>
</div>


.lol{width:100px;height:100px; background:red;margin:10px}
.lol div{display:none}
.lol:hover div{display:block} 

http://jsfiddle.net/kpblc/4Vfra/