A Hover Effect with jQuery or CSS3

I just wanted to share in interesting way of showing product prices for a e-commerce site, or any content that fits within an image with a simple cursor hover.

Here it is with jQuery:
Hover with jQuery

Here it is only using CSS:
Hover with CSS

This type of technique is elegant and can used to display text and make images or divs more interactive and interesting.

Simply, it hides the content with display:none, and with adjacent-sibling selector or jQuery's fade-in, fade-out functions we show and hide things on hover.

Sources:
The Adjacent-Sibling Selector
CSS3 :nth-child() Selector