Checking to make sure the same item can't be clicked twice in a row with jQuery / jScript
<p>So, I have a script I've been working on it can be seen here:
<a href="http://xeo.tryptamine.tv/lookbook2/" rel="nofollow">http://xeo.tryptamine.tv/lookbook2/</a>
Now if you play around with that script you will see if you click the image it's already on it still gets that fade effect. I need to know how to properly unbind the event and rebind it after another one is clicked. Here is the click function for it:</p>

<pre><code>            $('.righticons img').click(function(){
            var z = $(this).attr("class");
            $('.main a img:eq('+z+')').hide();
            $('.main a img:eq('+z+')').css({"z-index": y});
            $('.main a img:eq('+z+')').fadeIn();
            y++;
</code></pre>

<p>I have tried to make an if statement something like this, but last came up undefined.</p>

<pre><code>            $('.righticons img').click(function(){
            var z = $(this).attr("class");
            if (z != last){
            var last = z;
            $('.main a img:eq('+z+')').hide();
            $('.main a img:eq('+z+')').css({"z-index": y});
            $('.main a img:eq('+z+')').fadeIn();
            y++;
            };
</code></pre>

<p>I even started toying around with .unbind('click') but have no clue how to bind it back. PS, I have the script generating a number for each thumb on the side and appending it to the class attribute according to it's array position. Thanks for any answers!</p>
