Tibi
Tibi

Reputation: 3

Jquery add class to parent of an anchor tag not working

I want to give a class to the parent li tag after clicking on the a tag. After clicking on the a tag it removes the class selected but I can not add it back.

<header class="main-header">
    <nav class="grid-container main-nav main-nav-big">
        <ul class="grid-12">
            <li class="liBig selected">
                <a href="#">Home</a>
            </li>
            <li class="liBig">        
                <a href="#">About</a>
            </li>
            <li class="liBig">
                <a href="#">Buy</a>
            </li>
            <li class="liBig">
                <a href="#">Contact</a>
            </li>
        </ul>
    </nav>      
</header>
$("nav ul li a").click(function(){
    $("nav ul").children().removeClass("selected");
    $("this").parent().addClass("selected");
});

Upvotes: 0

Views: 965

Answers (1)

void
void

Reputation: 36703

You need to remove " " from this, it is not a string and use e.preventDefault.

$("nav ul li a").click(function(e){
        e.preventDefault();
        $("nav ul").children().removeClass("selected");
        $(this).parent().addClass("selected");
});

Upvotes: 3

Related Questions