一个页面多个按钮组，怎么区分？

用了 buttons.css(v2.0)，主要使用到其中的 button-group，发现在一个页面里有一个以上按钮组的时候，没法区分，比如说：

<div>
	<font>性别：</font>
	<div class="button-group" name="b1">
	<button id="fsex0" name="fsex" type="button" class="button button-giant button-rounded">男</button>
	<button id="fsex1" name="fsex" type="button" class="button button-giant button-rounded">女</button>
	</div>

			
	<font style="font-size: 28px;">班级：</font>
	<div class="button-group" name="b2">
	<button id="fclass0" name="fclass" type="button" class="button button-jumbo button-rounded">1 班</button>
	<button id="fclass1" name="fclass" type="button" class="button button-jumbo button-rounded">2 班</button>
	<button id="fclass2" name="fclass" type="button" class="button button-jumbo button-rounded">3 班</button>
	<button id="fclass3" name="fclass" type="button" class="button button-jumbo button-rounded">4 班</button>
	</div>
</div>

这样出来的效果是，我选了“男”，再选择“ 1 班”，那么“男”就自动取消选择了，说明这几个 button，都是在同一个组里，我通过 id，name 等方式区分，发现没效果。要怎么做，才能达到我要的效果呢？