Hi All, I have 3 divs with the same name wrapped in a container. Each div includes a span. At the moment, when you hover over a div, its displays all spans.
What i want is if you hover over a specific div, i would like to display it's span only. Is this possible ? <html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.alert').hide(); $(this).hover( function () { $(".alert").show('slow'); }, function () { $(".alert").hide('slow'); } ); }); </script> <style type="text/css"> #container{ width: 600px; height: 300px; } .item{ float: left; width:200px; height:300px; } </style> </head> <body> <div id="container"> <div class="item"> <p>this is an item</p> <span class="alert">Here is a warning</span> </div> <div class="item"> <p>this is an item</p> <span class="alert">Here is a warning</span> </div> <div class="item"> <p>this is an item</p> <span class="alert">Here is a warning</span> </div> </div> </body> </html> Thanks in advance