CODEWITHSUNDEEP
javascriptjquerycss
Sang Yoo Kim
Sang Yoo Kim

Reputation: 365

adding and removing class by order

I am trying to make a script where if the user presses 'J' in the browser, the 'li' will be selected and given a css class to show that it is selected.

This is the code I have.

JS

    if (keyCode == 74) {
        if($('input').is(":focus")|| $('textarea').is(":focus")){
            return null;
        } else {
            e.preventDefault();
            if(! $('ul.question-list > li').hasClass('selected-child')){
                $('ul.question-list > li.question:first-child').addClass('selected-child');
            } else { 
                $('ul.question-list > li.question.selected-child').next().addClass('selected-child');
            }
        }
    }

The problem I am having is that after the next li element has the class, the li before still has the selected-child class(obviously).

How would I add to the script above to remove the selected-child from the li element before the new selected li?

Upvotes: 0

Views: 66

Answers (1)

Joshua Arvin Lat
Joshua Arvin Lat

Reputation: 1039

if (keyCode == 74) {
    if($('input').is(":focus")|| $('textarea').is(":focus")){
        return null;
    } else {
        e.preventDefault();
        if(! $('ul.question-list > li').hasClass('selected-child')){
            $('ul.question-list > li.question:first-child').addClass('selected-child');
        } else { 
            var selectedChild = $('ul.question-list > li.question.selected-child');
            selectedChild.removeClass('selected-child');
            selectedChild.next().addClass('selected-child');
        }
    }
}

Upvotes: 1

Related Questions