Using jQuery to Hover over one element and apply the effect in another
<pre><code>&lt;div class="views-row"&gt;
&lt;div&gt;
    &lt;h5 class="product-name"&gt;
        &lt;a href="#"&gt;Dots&lt;/a&gt;
    &lt;/h5&gt;  
&lt;/div&gt;  
&lt;div class="views-field"&gt;       
    &lt;div class="field-content"&gt;
        &lt;a href="#"&gt;
            &lt;img alt="" src="#" /&gt;
        &lt;/a&gt;
    &lt;/div&gt;  
&lt;/div&gt;
</code></pre>

<p></p>

<p>Here is the jquery:</p>

<pre><code>    $('.views-field').hover(function() {
    $('h5').css('text-decoration', 'underline');
}, function() {
    $('h5').css('text-decoration', 'none');
});
</code></pre>

<p>What the above code produces is the hover effect on all class items instead of just the item I am hovering. I tried to add <code>$(this).parent('views-row').find('h5').css('text-dec','under')</code>    .. but no beans there.</p>

<p>As you could of guessed I am a jqeury newbie and would really appreciate a point in the right direction...</p>

<p>Thanks in advance</p>
