Question

this is html part

<!-- html part -->
<ul id="accordion">
  <li>
     <a href="#" class="item popular" rel="popular"></a>
      <ul id="online" class="list_friends">
        <li class="ch0"><img src="img/49992_720384020_1896998575_q.jpg" />a</li>
        <li class="ch1"><img src="img/48983_615523712_8495_q.jpg" />b</li>
        <li class="ch2"><img src="img/41621_717814907_4472_q.jpg" />c</li>
      </ul>
  </li>
</ul>

this is css part

#online li{
    width:179px;
    height:40px;
    margin:0px 0px 0px 0px;
    padding:0px 0px 0px 0px;
    font-size:17px;
    color:#999999;
    background:url(../img/green.png) no-repeat 8% 50%,url(../img/back_line.png);
}

I want to give a change to ch0 class
I want to keep url(../img/green.png), replace url(../img/back_line.png) to url(../img/login_line.png) and add url(../img/invite.png);

how to implement Jquery?

any thought

Thank you in advance.

Answer 1

You can use .css('background', 'newValue'); to this.

Something like this

$(".ch0").css('background', 
   'url(../img/green.png) no-repeat 8% 50%,url(../img/login_line.png)';

This will change the background image for all the items which has ch0 as class.

Demo on jsFiddle.net.

Hope this helps you.