Question

I’m working on an iTunes style cover flow with Jquery. I don’t use the Jquery framework all that often. I don’t want to use a plugin, most of them seem like overkill for what I want. http://jsfiddle.net/zorikii/cL63y/

Currently, I am just trying to remove the active tag from an img element.

$(".imgFrame img").removeClass(function(index, currentClass) {
    var removedClass;
    if ( currentClass === "active" ) {
        removedClass= "active";
    }
    return removedClass;
});

The classes are declared as follows:

.imgFrame
.imgFrame > img
.imgFrame.active > img

EDIT: HTML:

<div class="imgFrame active">
    <img src="http://placehold.it/50x75"/>
</div>
<div class="imgFrame">
    <img src="http://placehold.it/50x75"/>
</div>

I have a feeling $(".imgFrame img") is not what I am looking for, though I have seen Jquery objects like that before in a different context.

Answer 1

All you need is $('.imgFrame').addClass('active'); and $('.imgFrame.active').removeClass('active'); to add & remove those classes. However if you want to do something a little more indepth like check if the next() item element is available to addClass you can do something like this:

$('#btnNext').on('click', function() {
    var $curImg = $('.imgFrame.active'),
        $nextImg = $curImg.next();
    if ($nextImg.length) {
        $nextImg.addClass('active');
    } else {
        $('.imgFrame').first().addClass('active');
    }
    $curImg.removeClass('active');
});

Here’s a jsFiddle example with the code from your fiddle.