Question

I’m a bit new to jQuery and I have difficulties in achieving a function so I really hope somebody could guide me a bit. What I basically want to do is to highlight 2 elements simultaneously (via toggleClass).

Basically I have a repeating div (#post) which contains a title, thumb and description div. What I would like to do is once I hover on the title or the thumb div the elements to get a new additional class (xxxHover). So basically once the user hovers the mouse on the title/thumb div the title/thumb div (both of them) get a new class called (xxxHover where xxx stands for the div name – in this case titleHover/thumbHover).

I might not be the best in explaining so I’ve prepared a jsFiddle as well:

http://jsfiddle.net/yLqnd/12/

As you can see my problem is to restrict the scripts for the current element only (#post in our case). If it helps or matter I have to say that this will be integrated into a WordPress website (so the HTML structure is basically in the loop.php), that’s why I would like to restrict the 2x highlight effect only per item (#post).

Thanks a mill in advance for any idea!

Answer 1

http://jsfiddle.net/oscarj24/yLqnd/13/