jQuery trigger click endless loop

Question

why is this jQuery code endlessly looping as soon as the line

//$('.'+triggerThisChild).trigger("click"); // this causes endless loop

is uncommented FIDDLE is here

jQuery code:

$('a.touchNav').on('click touchend', function (e) {
    var fancy = this.className.indexOf('fancy') != -1;
    var target = $(this).attr('target') == '_blank' ? true : false;
    if (fancy) {
        var triggerThisChild = $(this).children('span').attr('class');
        alert(triggerThisChild);
        e.stopPropagation();
        //$('.'+triggerThisChild).trigger("click"); // this causes endless loop
        //return false;
    } else if (target) {
        window.open(this.href,target);
        return false;
    } else {
       window.location = this.href;
       return false;
    }
});

$(".showFancyBox").fancybox({
    "width" : "75%",
    "height" : 800,
    "transitionIn" : "none",
    "transitionOut" : "none",
    "type" : "iframe",
    'href' : "http://www.google.com"
});

HTML:

<li>
<a class="touchNav" href="http://www.google.com" target="_blank">
    Nav Point 1
</a>
</li>
<li>
<a class="touchNav" href="http://www.stackoverflow.com" target="_blank">
    Nav Point 2
</a>
</li>
<li>
<a class="fancy touchNav" href="#">
    <span class="showFancy0" style="display:none;"></span>
    Nav Point 3
</a>
</li>

Answer 1

The click event on .showFancy0 bubbles up to the parent a and the whole thing runs again.

Add this code to stop it happening...

$(".showFancy0").on("click", function(e) {
    e.stopPropagation();
});

Working fiddle