Bootstrap 3 Template

This is a simple Twitter Bootstrap 3 template. You can fork it to get a ready to use Bootstrap 3 fiddle.

by Behseini

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<div class="container">
  
  
<div class="well well-sm"> 
   <input type="radio" name="animal" value="Cat" />Do Nothing<br />
   <input type="radio" name="animal" value="Dog" />Show Hidden 1<br />
   <input type="radio" name="animal" value="Bird" />Show Hidden 2<br />
</div>

<div class="list-group">
  <button type="button" class="list-group-item">Cras justo odio</button>
  <button type="button" class="list-group-item hidden" id="hidden-list-1">Dapibus ac facilisis in</button>
  <button type="button" class="list-group-item">Morbi leo risus</button>
  <button type="button" class="list-group-item">Morbi leo risus</button>
  <button type="button" class="list-group-item hidden" id="hidden-list-2">Porta ac consectetur ac</button>
  <button type="button" class="list-group-item">Vestibulum at eros</button>
</div>
</div>

CSS

body {
    margin: 10px;
}

JavaScript

$(function(){
    
$('input:radio').change(
                        function(){
                            if($(this).val()== 'Dog'){
                          $('#hidden-list-1').slideDown();  
                            }
                            if($(this).val()== 'Bird'){
                          $('#hidden-list-2').slideDown();  
                            }
                        }
                    );
});