hover element A, show/hide Element B

hover, jquery

Solution

The following will match all of your images, and target their first sibling having the tag P.

<script type="text/javascript">
$(document).ready(function(){
    $("div.box img").hover(
      function(){$(this).siblings("p:first").show();},
      function(){$(this).siblings("p:first").hide();}
    );
});
</script>

<div class="box">
  <img src="somefile.jpg" />
  <p>This text will toggle.</p>
</div>

Problem

I have a `<div>` element containing an image. Inside that div, I have a `<p>` element which holds some information about the image. I want to hover the `<div>` containing the image and then show or hide the `<p>` element. ``` <div class="box"> <img src="img/an_039_AN_diskette.jpg" width="310px" height="465px" /> 6 Pharma IT <p class="hoverbox">some information</p> </div> ``` Is there an easy way to do so in jQuery?

Original source