Javascript JS只使用一个id，而忽略其他id

我添加了文本大小调整器

，但它正在处理最后一个ID，请帮助我修复它

---

您为什么不编写以下代码，这是更可靠的代码：

$("a").click(function(e){
     e.preventDefault();
     $("a").removeClass("selected");
     $(this).addClass("selected");

     var type = $(this).attr('id');
     if(type=="small"){
         //Your code for small text
     }
     else if(type=="medium"){
         //Your code for medium text
     }
     else if(type=="large"){
         //Your code for large text
     }
});

---

看，当我单击resizer时，它只在最后一个idIt上工作。它在这里工作：您好，非常感谢，我是JS的初学者（Y）对不起，我没有足够的声誉来喜欢您的代码

$(document).ready(function(){

  $("#small").click(function(event){
    event.preventDefault();
    $("h1").animate({"font-size":"24px"});
    $("h2").animate({"font-size":"16px"});
    $("p").animate({"font-size":"12px", "line-height":"16px"});

  });

  $("#medium").click(function(event){
    event.preventDefault();
    $("h1").animate({"font-size":"36px"});
    $("h2").animate({"font-size":"24px"});
    $("p").animate({"font-size":"14px", "line-height":"20px"});

  });

  $("#large").click(function(event){
    event.preventDefault();
    $("h1").animate({"font-size":"48px"});
    $("h2").animate({"font-size":"35px"});
    $("p").animate({"font-size":"30px", "line-height":"40px"});

  });

  $( "a" ).click(function() {
   $("a").removeClass("selected");
  $(this).addClass("selected");

 });

});

$("a").click(function(e){
     e.preventDefault();
     $("a").removeClass("selected");
     $(this).addClass("selected");

     var type = $(this).attr('id');
     if(type=="small"){
         //Your code for small text
     }
     else if(type=="medium"){
         //Your code for medium text
     }
     else if(type=="large"){
         //Your code for large text
     }
});