Jquery, Click / If Else function, Not working
<pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;html&gt;&lt;head&gt;
&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
&lt;title&gt;If Else&lt;/title&gt;
&lt;script type="text/javascript" src="/jquery-1.3.2.min.js"&gt;&lt;/script&gt;
&lt;style  TYPE="text/css"&gt; 

    .show                                       { display:block; }
    .hide                                       { display:none; }

&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;script type="text/javascript"&gt;
$('#portweb').click(function() {

    if ('li[value*=web] img'.hasClass("hide")) {
        $('li[value*=web] img').removeClass('hide').addClass('show');
    }
    else if ('li[value*=web] img'.hasClass("show")) {
        $('li[value*=web] img').removeClass('show').addClass('hide');
    }

});
&lt;/script&gt;

&lt;a href="#" id="portweb"&gt;Web&lt;/a&gt;
&lt;br /&gt;

        &lt;ul id="portfolioWrapperSet"&gt;
            &lt;li value="web dev"&gt;&lt;a href="#"&gt;&lt;img src="images/portfilio/ph1.jpg" class="hide" /&gt;&lt;/a&gt;&lt;/li&gt;
            &lt;li value="web packaging print media"&gt;&lt;a href="#"&gt;&lt;img src="images/portfilio/ph2.jpg" class="hide" /&gt;&lt;/a&gt;&lt;/li&gt;
            &lt;li value="tv packaging print media"&gt;&lt;a href="#"&gt;&lt;img src="images/portfilio/ph3.jpg" class="hide" /&gt;&lt;/a&gt;&lt;/li&gt;
            &lt;li value="web packaging print media social"&gt;&lt;a href="#"&gt;&lt;img src="images/portfilio/ph4.jpg" class="hide" /&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;


&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<hr>

<p>So the problem im having is actually getting my function to remove the '.hide' class then add the '.show' class through my if statement.</p>
