SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Enthusiast
    Join Date
    Feb 2011
    Posts
    48
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    jQuery remove class

    I want to be able to apply a class to my body tag to change the displayed font of the whole page but I'm not to sure how to go about it

    I'd be ok if I only had 2 classes to change between but I have about 7 and will add more so what I need is someway of removing any class applied and then apply a class from which ever button is clicked.

    What I have:
    HTML Code:
    $('#class-changer li a.class1').click(function() {
                    $(body).removeClass("whichever is active");
                     $(body).addClass("class-1");
    }); 
    $('#class-changer li a.class2').click(function() {
                    $(body).removeClass("whichever is active");
                     $(body).addClass("class-2");
    });
    $('#class-changer li a.class3').click(function() {
                    $(body).removeClass("whichever is active");
                     $(body).addClass("class-3");
    });
    
    etc etc
    HTML Code:
    <div class="class_menu">
    <ul id="class-changer">
    <li><a href="#1" class="class1">class1</a></li>
    <li><a href="#2" class="class2">class2</a></li>
    <li><a href="#3" class="class3">class3</a></li>
    <li><a href="#4" class="class4">class4</a></li>
    <li><a href="#5" class="class5">class5</a></li>
    </ul>
    </div>
    any help will be appreiciated, thanks.

  2. #2
    SitePoint Enthusiast
    Join Date
    Feb 2011
    Posts
    48
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Figured it out.

    needed:
    HTML Code:
    $('#class-changer li a.class2').click(function() {
                    $('body').removeClass();
                     $('body').addClass("class-2");
    });
    also placing it under my call to jquery.js at the bottom of my markup helped


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •