jQuery click event with class selector only fires once

Question

I'm using classed links to change FlowPlayer content. Here is a working version: http://jsfiddle.net/r9fAj/

In my actual page using the same code the first link clicked works fine. The second one does not fire the click function at all. Even if I comment out everything but the console.log()...

$('.playerLink').click( function() {
    audioPlayer.unload();
    initAudioPlayer();
    $('#player').css('display', 'block');
    $('#player').animate({"height":"50px"}, 1000);
    var newClip = {'url':$(this).attr('ajax-data'),'autoplay':true};
    audioPlayer.play(newClip);
    console.log('playing ' + $(this).attr('ajax-data'));
});

HTML like so

<a href="#" ajax-data="/audio/episodes/09_27_2013_Happy_Hour_88509726.mp3" class="playerLink">Listen</a>
<a href="#" ajax-data="/audio/episodes/10_04_2013_Happy_Hour_3478965.mp3" class="playerLink">Listen</a>

<a id="flowplayer" href="/audio/episodes/09_27_2013_Happy_Hour_88509726.mp3"></a>

And the player initialized like so:

var audioPlayer;

var initAudioPlayer = function () {
    $f("flowplayer", "/player/flowplayer-3.2.16.swf", {
        plugins: {
            controls: {
                fullscreen: false,
                autoHide: false,
            }
        },
        clip: {
            autoPlay: false,
            url: "",
        }
    });

    audioPlayer = $f();
};
initAudioPlayer();

Since the jsFiddle works over and over I assume something else in my page is preventing the second click() from working but the console has no errors for me.

So my question is, short of posting the whole site's code how do I pursue debugging this?

Answer 1

So this is the first site I have done where content is delivered via AJAX and internal links are caught by

 $("a:not([href^='http://'])").click( function(e) { 
    var url = $(this).attr("href");
    var title = ($(this).attr("title")) ? ': ' + $(this).attr("title") : '';
    e.preventDefault(); 
    if(url!=window.location){
       window.history.pushState({path:url},title,url);
       $('#contentMain').load(url);
        document.title = "It's New Orleans" + title;   
    }
});

For some reason it does work once to click a link with the class but the second time gets preventDefault()ed.

<a href="#" ajax-data="/audio/foo.mp3" class="playerLink">Listen</a>

The fix was adding [href^='#'] to not() e.g.

$("a:not([href^='http://'],[href^='#'])").click( function(e) {