Question

50

On click, add/remove class from another div

rated 0 times [ 57] [ 7] / answers: 1 / hits: 45519 / 9 Years ago, sun, march 8, 2015, 12:00:00

I am looking to add/remove a class from another div when a link is pressed. I have searched through several answers and searched online but could not find an answer that worked for me.

Here is my code:

<nav id=primary-menu> <a class=menu-toggle>Browse</a>

    <ul>

        <li><a href=#>Home</a></li>

        <li><a href=#>News</a></li>

        <li><a href=#>Rumors</a></li>

        <li><a href=#>Tutorials</a></li>

        <li><a href=#>Miscellaneous</a></li>

    </ul>

</nav> <!-- end #primary-menu -->

I am looking to add the class active to #primary-menu when .menu-toggle is clicked.

For JS/jQuery, I've tried click, toggle, toggleClass, I've tried inlining the code, I've tried external scripts. Nothing seems to work and I'm not sure why.

I'd really appreciate your responses. PS: I'm not the best with JS/jQuery.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

yulisa

Add To Favorites

Follow

Total Points: 436

Total Questions: 102

Total Answers: 123

Location: Palau

Member since Tue, May 30, 2023

1 Year ago

yulisa questions

1 Apollo React Why Can't Query inside UseEffect hook

Sun, Jun 20, 21, 00:00, 3 Years ago

1 Parcel JS: tree.render is not a function

Wed, Apr 14, 21, 00:00, 3 Years ago

1 Uncaught SyntaxError: import not found: default works in one module and not in another

Mon, Mar 15, 21, 00:00, 3 Years ago

1 aws s3 putObject error MissingRequiredParameter

Fri, Aug 7, 20, 00:00, 4 Years ago

1 How can I kill a SignalR connection?

Mon, Mar 23, 20, 00:00, 4 Years ago

View All

answered 9 Years ago quinlanhenryf · Accepted Answer

http://jsfiddle.net/te7brkmj/

this combination of 'click' and 'toggleClass' works for me.

$('.menu-toggle').click( function() {

    $(#primary-menu).toggleClass(someClass);

} );

Try this:

$('.menu-toggle').click( function() {

    $(#primary-menu).toggleClass(someClass);

} );

.someClass{

    color: red;    

}

   



<script src=https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js></script>



<nav id=primary-menu>



<a class=menu-toggle>Browse</a>



    <ul>



        <li><a href=#>Home</a></li>

        <li><a href=#>News</a></li>

        <li><a href=#>Rumors</a></li>

        <li><a href=#>Tutorials</a></li>

        <li><a href=#>Miscellaneous</a></li>



    </ul>



</nav> <!-- end #primary-menu -->