Jquery image rollover on parent li hover -
i have responsive image based nav menu used jquery swap out rollover image. <ul id="mainmenu"> <li><a href="#"><img src="nav1-off.png" class="rollover"/></a> <div class="mega-menu"><p>mega menu content in here</p></div> </li> <li><a href="#"><img src="nav2-off.png" class="rollover"/></a> <div class="mega-menu"><p>mega menu content in here</p></div> </li> </ul> $("img.rollover").hover( function() { this.src = this.src.replace("-off", "-on"); }, function() { this.src = this.src.replace("-on", "-off"); }); how instead toggle image src when parent li hovered over. basically need when newly added mega menu divs hovered on hover image still shows in menu.