jquery - Prepend/Append an Image only in active class by Click Function -

i know don't meet often..but i'll try describe it.

i have list of links. have script makes link has been clicked active adding class it. every time link clicked, have different active link.

problem every time happens, want image prepend active link. manage add image unfortunately script add image every time clicked on link , not active link. want image prepend active class link.

my script is:

$(function(){     var sidebar = $('#sidebar');     sidebar.delegate('a.inactive','click',function(){         sidebar.find('.active').toggleclass('active inactive');         $(this).toggleclass('active inactive');         $(this).prepend('<img class="gallery-selected-bg" src="http://www.saugeentimes.com/496%20liz/girls%20soccer%20aug%204,%202010/soccer-ball-small.jpg">');     }); }); 

sorry if did not describe well, can see code please... if tell simpler want 1 ball active link may changes click.

http://jsfiddle.net/dstpt/390/

i modified code , cleaned abit...

here fiddle: http://jsfiddle.net/dstpt/395/

basically i'm using css :before show image.

html (simplified version need active class)

<div id="sidebar">     <ul>         <li><a href="#" id="1" class="active">1</a></li>         <li><a href="#" id="2">2</a></li>         <li><a href="#" id="3">3</a></li>     </ul> </div> 

js (simplified well)

$(function(){     var sidebar = $('#sidebar');     sidebar.delegate('a','click',function(){         sidebar.find('a').removeclass('active');         $(this).addclass('active');     }); }); 

css

a {     border:0;     background:0;     font-size:30px;     color:navy; }  a.active {     background-color:#ccd9ff;     border-radius:15px 15px;     font-size:30px;     color:red; }  a.active:before {     content: url('http://www.saugeentimes.com/496%20liz/girls%20soccer%20aug%204,%202010/soccer-ball-small.jpg'); }