JavaScript不适用于Twitter Bootstrap模式

我正在尝试使用twitter bootstrap的模式来实现一些javascript，该模式在jsFiddle上可以正常运行，但在我的网站上不起作用。

HTML：

<a href="#Modal1" class="link-glow" data-toggle="modal">link</a>

<div class="modal fade" id="Modal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                 <h4 class="modal-title" id="myModalLabel">Modal title</h4>
            </div>
            <div class="modal-body" id="modalBody"></div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

Javascript：

$('#Modal1').on('show', function () {
    $('#modalBody').html('<iframe width="560" height="315" src="//www.youtube.com/embed/8LCiz7OpfnQ?list=PLVL8S3lUHf0SxTfeIL55AGkEAd2zVPPbl" frameborder="0" allowfullscreen></iframe>');
}).on('hide', function () {
    $('#modalBody').html('');
});

谁能帮我找出问题所在吗？非常感谢！