字体真棒图标在点击时切换两次

Question

我正在使用字体真棒图标播放和暂停按钮。但是图标在点击时切换两次。任何人都可以帮助我。

<div>
    <a href="#" id="iconChange">
        <i class="fa fa-play"></i>
    </a>
</div>

$('#iconChange').click(function(){
    $(this).find('i').toggleClass('fa-play fa-pause');
});