button点击切换，获取按钮ID

<!DOCTYPE html>
<html>
<head lang="zh-CN">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <style>
    .sms-type button{
    width: 60px;
    height: 30px;
    margin-right: 10px;
    border: #d0d0d0 1px solid;
    background-color: #f5f5f5;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    outline: none;
    cursor: pointer;
}
.sms-type button.on-sel{
    border: #ff7e0e 1px solid;
    background-color: #fff0c5;
}
    </style>
    <script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
    <script type="text/javascript">
            function  replyDetailClick(){
            $(".reply-details .sms-type button").click(function(){
            $(".reply-details .sms-type button").removeClass("on-sel");
            $(this).addClass("on-sel");
        })
    }
            function getButtonId(){
            $(".sms-type button").click(function(){    
                    var buttonId = $(this).attr("id");
                    alert("buttonId："+buttonId);
                });
    }
    
            $(document).ready(function() {   
                replyDetailClick();
                getButtonId();
              });
    </script>
    
</head>
<body>
<div class="reply-details">
            <div>
                <label class="sms-type">
                    <button  id="all" class="on-sel">全部</button>
                    <button id="one">1</button>
                    <button id="two">2</button>
                    <button id="three">3</button>
                    <button id="other">其他</button>
                </label>
            </div>
        </div>
</body>
</html>
button点击切换，获取按钮ID

推荐阅读
