Learn free online HTML5, javascript, and jquery Tutorials by Examples

Sunday 18 May 2014

Add or Remove class in jQuery

----------------------------------------------
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function() {
 $("nav li").click(function() {
       $("nav li.active").removeClass('active');
            $(this).addClass("active");
   });
});
</script>

<nav>
    <ul>
        <li><a href="#">home</a></li>
            <li><a href="#">blog</a></li>
            <li><a href="#">contact</a></li>
            <li><a href="#">about</a></li>
        </ul>
    </nav>


<style>
.active a {color: #C51D1D;}
</style>

----------------------------------------------

No comments:

Post a Comment