同级的父级元素怎么选择？

Question

问题描述：
Fingerprint与Facial是同级，在每个下拉中都有对应的不同的按钮，当选择中Fingerprint下的其中一个按钮时，其它同Fingerprint一级别中的其它button都是未选中状态的，怎么选择？：

<div class="mui-table-view">
            <div id="Fingerprint" class="mui-table-view-cell mui-collapse">
                <a class="mui-navigate-right" href="#">Fingerprint</a>
                <div class="mui-collapse-content anviz-collapse-content">
                    <button type="button" class="anviz-sub-product-btn mui-btn-danger" data-id="1">All</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="6">Standalone Access Control</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="8">Standalone Time Attendance</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="9">Smart Lock</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="10">Modules</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="7">SDK</button>
                </div>
            </div>
            <div id="Facial" class="mui-table-view-cell mui-collapse">
                <a class="mui-navigate-right" href="#">Facial</a>
                <div class="mui-collapse-content anviz-collapse-content">
                    <button type="button" class="anviz-sub-product-btn" data-id="11">All</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="12">USB Scanner</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="13">USB Identification Device</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="14">Standalone Modules</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="15">Standalone Terminal</button>
                    <button type="button" class="anviz-sub-product-btn" data-id="16">SDK</button>
                </div>
            </div>
</div>

//选中button切换，我这样选择不起作用，当选择Fingerprint下的第一个按钮时，其它同级下的按钮有也被选中的情况。
        jQuery('#cropper-sheet .anviz-sub-product-btn').on('tap',function(e){
            e.stopPropagation();
            var index = $(this).index();
            var id = jQuery(this).attr('data-id');
            $(this).siblings().parent().children("button").attr("class", "anviz-sub-product-btn");
            $(this).attr("class", "mui-btn-danger");
        });

Answer 1

没大看懂你想要的效果，所有button都是互斥的？不知道这样是否可行

$('.anviz-sub-product-btn').on('tap', function(e) {
    $('.mui-btn-danger').removeClass('mui-btn-danger');
    $(this).addClass('mui-btn-danger');
});

Answer 2

如果没有理解错你的意思的话，你是不想改变被点击的按钮同一父元素下的按钮，只改变父元素的siblings的子元素的按钮。可以改为：

$(this).parent().parent().siblings().find("button").attr("class", "anviz-sub-product-btn");

你的错误的原因应该是少算了button外面的一层div