为什么我不能让这个脚本在Joomla 3中运行

Question

我试图获得一个基本循环和交叉淡入淡出jquery函数，以便在连续DIV层上的Joomla 3中工作。我读到的所有内容似乎都无法澄清我做错了什么。 这是div HTML：

<div class="quotes">
<p><i>"Quote 1 with many lines of text"
<br>
Blessings,</i></p>
<p><b><i>Sherry</i></b>
</div>

<div class="quotes">
<p><i>
"Quote 2 with many lines of text"
<br>
Take care my friend,</i></p>
<p><b><i>Liz</i></b>
</div>

这里是jquery：

(function() {

var quotes = $(".quotes");
var quoteIndex = -1;

function showNextQuote() {
    ++quoteIndex;
    quotes.eq(quoteIndex % quotes.length)
        .fadeIn(2000)
        .delay(2000)
        .fadeOut(2000, showNextQuote);
}

showNextQuote();

})();

和相应的CSS：

.quotes {display: none;}

我能够让代码在jsfiddle中运行，但不是我的Joomla 3网站。您可以在此处看到它正常运行：http://jsfiddle.net/n4mKw/4290/

请指导我如何在Joomla 3中使其正常运行。提前感谢！