js hover visibility (using show & hide)

by Roberto Apasajja

HTML

<div id="one">
    one
    <div id="two">
        two
    </div>
</div>

<div id="first">
    first
    <div id="second">
        second
    </div>
</div>

CSS

#one{
    width:200px;height:100px;
    background:pink
}

#two{
    width:100px;height:50px;
    background:purple
}

#first{
    width:200px;height:100px;
    background:green
}

#second{
    width:100px;height:50px;
    background:red
}

#aaa{
    width:200px;height:100px;
    background:yellow
}

#bbb{
    width:100px;height:50px;
    background:blue
}

/***************************************/
/* hovering                            */
/***************************************/

#first #second{
   display:none;
}

JavaScript

$("#one").hover(function(){
    $('#second').show();
},function(){
    $('#second').hide();
});