使用jquery 和 css 实现互斥按钮状态切换

实现效果如上图所示

css代码

.invitebtn .selected {
    color: #fff;
    background: rgba(59,181,182, 1);
  } 

jquery代码

//切换样式
    $(".invitebtn input").click(function(e){
        $(this).addClass('selected').siblings().removeClass('selected');
        if($(".invitebtn input").hasClass('invite-email selected')){
         $(".send-invites-input").attr("placeholder","多个邮箱之间用逗号隔开。");
       }else{
         $(".send-invites-input").attr("placeholder","多个电话之间用逗号隔开。");
       }
     })

HTML代码

<div class="invitebtn">
      <input type="button" class="invite-phone" value="电话号码" />
      <input type="button" class="invite-email selected" value="邮箱地址" />
    </div>