Edit Question - KnowledgeHub

Title Body

I have a number of parent divs (.parent_div), which each contain a child div (.hotqcontent) where I output data from my database using a loop. The following is my current markup: <div class="content"> <div class="parent_div"> <div class="hotqcontent"> content of first div goes here... </div> <hr> </div> <div class="parent_div"> <div class="hotqcontent"> content of second div goes here... </div> <hr> </div> <div class="parent_div"> <div class="hotqcontent"> content of third div goes here... </div> <hr> </div> <div class="parent_div"> <div class="hotqcontent"> content of fourth div goes here... </div> <hr> </div> </div> What I would like to achieve is when a user hovers / mouseovers a parent div, the contents of the child div contained within should be revealed. To achieve this I wrote the following jQuery script but it doesn't appear to be working. It's not even showing the alert! <script> $(document).ready(function() { $(function() { $('.parent_div').hover(function() { alert("hello"); $('.hotqcontent').toggle(); }); }); }); </script> How can I modify or replace my existing code to achieve the desired output?

Tags (comma-separated) Cancel