remove class from all other list items
<p>I've gotten help from others on this, but their replies were a little bit too broad to help me... I'm a newb when it comes to javascript so I can't quite wrap my head around their answers (and everything I've tried in the last 3 days hasn't worked.) The working site is here: <a href="http://www.studioimbrue.com/beta" rel="nofollow">http://www.studioimbrue.com/beta</a>   The problem is that with the thumbnails, once clicking them it adds the .selected class properly but when clicking on another, it fails to strip the .selected class from any of the other thumbnails. If you can just correct the code I have that would be amazing, and if you feel like explaining what I had wrong, go right ahead!</p>

<pre><code>$(document).ready(function(){ 
    var activeOpacity   = 1.0,
        inactiveOpacity = 0.6,
        fadeTime = 100,
        clickedClass = "selected",
        thumbs = "#list li";

    $(thumbs).fadeTo(1, inactiveOpacity);

    $(thumbs).hover(
        function(){
            $(this).fadeTo(fadeTime, activeOpacity);
        },
        function(){
            // Only fade out if the user hasn't clicked the thumb
            if(!$(this).hasClass(clickedClass)) {
                $(this).fadeTo(fadeTime, inactiveOpacity);
            }
        });
     $(thumbs).click(function() {
         // Remove selected class from any elements other than this
         var previous = $(thumbs+'.'+clickedClass).eq();
         var clicked = $(this);
         if(clicked !== previous) {
             previous.removeClass(clickedClass);
         }
         clicked.addClass(clickedClass).fadeTo(fadeTime, activeOpacity);
     });
});
</code></pre>
