Filter Buttons for Existing Markup
by bizamajig
HTML
<link rel="stylesheet" href="http://twitter.github.io/bootstrap/assets/css/bootstrap.css">
<div class="btn-group d1" data-toggle="buttons-checkbox">
<button type="button" class="btn btn-link ra"><span class="vicon" data-icon=""></span>A</button>
<button type="button" class="btn btn-link rb"><span class="vicon" data-icon=""></span>B</button>
<button type="button" class="btn btn-link rc"><span class="vicon" data-icon=""></span>C</button>
</div>
<div class="myDiv rad">AAAAAAAAAAAA<br />AAAAAAAAAAAA</div>
<div class="myDiv rbd">BBBBBBBBBBBB<br />BBBBBBBBBBBB</div>
<div class="myDiv rcd">CCCCCCCCCCCC<br />CCCCCCCCCCCC</div>
JavaScript
var buttons = $(".btn-link");
buttons.on("click",function(){
$(this).toggleClass('sel');
buttons.each(function(i,e) {
var $this = $(e);
var current = $("."+($this.attr('class').split(' '))[2]+"d");
if($this.hasClass('sel')) {
current.show();
} else {
current.hide();
}
});
if($('.sel').length==0) {
$('.myDiv').show();
}
});