jQuery Add Class doesn't work
<p>I want to add a class to an object when I click on an div with the class "arrow right" or "arrow left".
On <a href="http://jsfiddle.net/" rel="nofollow">http://jsfiddle.net/</a> does it work perfect. But on my Site it doesn't work :(</p>

<p>Can anyone help me?</p>

<p>jQuery:</p>

<pre><code>var currentPage = 0;
var lastPage = ($(".post-preview &gt; div").length)-1;
currentPage = $('.post-preview &gt; div.show').attr('id');

$('.news &gt; .right').stop().click(function() {
    if (currentPage == lastPage) {
            $('.post-preview &gt; div#' + lastPage).hide();
            $('.post-preview &gt; div#' + lastPage).removeClass('show');

        $('.post-preview &gt; div#0').fadeIn(300);
        $('.post-preview &gt; div#0').addClass('show');
        currentPage = 0;
    } else {
        $('.post-preview &gt; div#'+currentPage).hide();
        $('.post-preview &gt; div#'+currentPage).removeClass('show');
        currentPage++;
        var nextPage = currentPage;
        currentPage--;
        $('.post-preview &gt; div#'+nextPage).fadeIn(300);
        $('.post-preview &gt; div#'+nextPage).addClass('show');
        currentPage = nextPage;
    }
 });

 $('.news &gt; .left').stop().click(function() {
     if (currentPage == 0) {
        $('.post-preview &gt; div#0').hide();
        $('.post-preview &gt; div#0').removeClass('show');

        $('.post-preview &gt; div#' + lastPage).fadeIn(300);
        $('.post-preview &gt; div#' + lastPage).addClass('show');
        currentPage = lastPage;
    } else {
        $('.post-preview &gt; div#'+currentPage).hide();
        $('.rpost-preview &gt; div#'+currentPage).removeClass('show');
        currentPage--;
        var nextPage = currentPage;
        currentPage++;
        $('.post-preview &gt; div#'+nextPage).fadeIn(300);
        $('.post-preview &gt; div#'+nextPage).addClass('show');
        currentPage = nextPage;
    }
});
</code></pre>

<p>CSS for show class:</p>

<pre><code>.news &gt; .post-preview &gt; div.show    { display: inline-block !important; }
</code></pre>

<p>My HTML Code:</p>

<pre><code>&lt;div class="news"&gt;
&lt;div class="arrow left"&gt;&lt;/div&gt;
    &lt;div class="post-preview"&gt;
        &lt;div id="0" class='show'&gt;&lt;/div&gt;
        &lt;div id="1"&gt;&lt;/div&gt;
        &lt;div id="2"&gt;&lt;/div&gt;

    &lt;/div&gt;
&lt;div class="arrow right"&gt;&lt;/div&gt;
&lt;/div&gt;
</code></pre>
