How do I loop this in javascript?
<p>So I have an onclick event and then another event on the same click. Basic function works like this:</p>

<p>1) Click image - Zoom 700%
2) Click image again - Zoom 100%
3) Click image again - Zoom 100%</p>

<p>I want step 3 to revert back to step 1 and then to 2 etc. Right now, it just repeats step 2 forever instead of reverting back to default.</p>

<p>Here is the code:</p>

<pre><code>$(document).ready(function() {
    $(".zoomTarget").debug();
    $(window).resize(function(evt) {
        $(".zoomTarget").debug();
    });
    $(".zoomTarget").click(function(evt) {
        evt.stopPropagation();
        $(this).zoomTo({
            targetsize: 5.0
        }); {
            $(".zoomTarget").click(function(evt) {
                evt.stopPropagation();
                $("body").zoomTo({
                    targetsize: 1.0
                });
            });
        }
    });
    $(document).click(function(evt) {
        evt.stopPropagation();
        $("body").zoomTo({
            targetsize: 1.0
        });
    });
    $("body").zoomTo({
        targetsize: 1.0
    });
};
</code></pre>
