Links stop working after initial click using isotope

Question

I have generated a sortable grid using isotope which moves items where their header has been clicked to the top of the grid and expands them.

It is almost working I just have one issue..

Once the item has been clicked and sorted the item header can no longer clicked or interacted with.

$('.itemheading a').on("click",function() {
    e.preventDefault();
    var activeElement = $(this).closest('.item');
    activeElement.addClass('active').siblings('.item').removeClass('active');

    $("html, body").animate({ scrollTop: 0 }, "slow");

    container
        .prepend(activeElement.remove())
        .isotope('reloadItems')
        .isotope({ sortBy: 'original-order' });

    return true;
});

I have placed an example on jsfiddle:

http://jsfiddle.net/BptVU/4/

Cheers

Answer 1

You need to use delegation with .on():

DEMO

 $('.content').on('click','.itemheading a', function (e) {...});