When hover a text, change the background of other div using jquery
<p>When hover the link I am trying to change the background of previous div, But here it is not working here is code <a href="http://jsfiddle.net/sureshpattu/FEdk9/" rel="nofollow">Jsfiddle</a>    this is my script  </p>

<pre><code>$('div a.link').hover(function(){

var icon = $(this).prevAll('div.icon').first();          
          icon.css({'background':'url(http://www.rangde.org/images/icons/circle_grey_hover.jpg) no-repeat', 'color':'#fff','cursor':'pointer'});

 });          
</code></pre>

<p>my html </p>

<pre><code>&lt;div class="icon"&gt;1&lt;/div&gt;
&lt;div&gt;&lt;a href="#" class="link"&gt;First article&lt;/a&gt;&lt;/div&gt;
&lt;div class="clearfloat"&gt;&lt;/div&gt;
&lt;div class="icon"&gt;2&lt;/div&gt;
&lt;div&gt;&lt;a href="#" class="link"&gt;Second article&lt;/a&gt;&lt;/div&gt;
&lt;div class="clearfloat"&gt;&lt;/div&gt;
&lt;div class="icon"&gt;3&lt;/div&gt;
&lt;div&gt;&lt;a href="#" class="link"&gt;Third article&lt;/a&gt;&lt;/div&gt;
</code></pre>

<p>my css </p>

<pre><code>.icon{background: url(http://www.rangde.org/images/icons/circle_grey.jpg) no-repeat;
width: 92px;
height: 97px;
padding: 35px 0px 0px 45px;
font-size: 14pt;
color: black;
font-weight: 600;
width: 32%;float:left;}
.link{width:60%;float:left;color:#048ccc;font-weight:600;padding-top:30px;}
.clearfloat{clear:both;}
​
</code></pre>
