$(".choose").bind("click", function(event){ var targetId =$(this).attr("data-id"); $(".choose").removeClass("active"); switch(targetId){ case "page1": $(this).addClass("active"); break; case "page2": $(this).addClass("active"); break; case "page3": $(this).addClass("active"); break; case "page4": $(this).addClass("active"); break; case "page5": $(this).addClass("active"); break; case "page6": $(this).addClass("active"); break; } }); $(document).ready(function() { $(".jump").click(function() { $("html, body").animate({ scrollTop: $($(this).attr("href")).offset().top + "px" }, { duration: 500, easing: "swing" }); return false; }); });