Bootstrap Skeleton

This is a simple Bootstrap skeleton. You can fork it to get a ready to use Bootstrap fiddle.

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<div class="accordion" id="accordion2">
					<div class="accordion-group">
						<div class="accordion-heading">
							<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
								Category 1 <i class="icon-chevron-right"></i>
							</a>
						</div>
						<div id="collapseOne" class="accordion-body collapse">
							<div class="accordion-inner">
                                hello
                            </div>
						</div>
					</div>
					<div class="accordion-group">
						<div class="accordion-heading">
							<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
								Category 2 <i class="icon-chevron-down"></i>
							</a>
						</div>
						<div id="collapseTwo" class="accordion-body collapse in">
							<div class="accordion-inner">
								<div class="row-fluid">
									<ul class="thumbnails">
										<li class="span6 rental-object">
											<div class="thumbnail">
												<div class="caption">
													<h4>Product 1</h4>
													<div class="white-bar-remover">
													
												</div>
													<p>Description</p>
													<div id="rental5" class="collapse rental-options">
														
														<div class="well">
														<div class="control-group">
															<label class="control-label" for="item4-option1">Options</label>
															<div class="controls">
																<input type="checkbox" value="" id="item4-option1">
															</div>
														</div>
														
													</div>
													</div>
													<span class="btn btn-primary btn-switch" data-toggle="collapse" data-target="#rental5"><i class="icon-ok-circle icon-white"></i> Add to Quote</span>
												</div>
											</div>
										</li>
										<li class="span6 rental-object">
											<div...

CSS

@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');

.container {
    margin-top: 10px;
}

JavaScript

$('.collapse').on('show', function(){
    $(this).parent().find(".icon-chevron-right").removeClass("icon-chevron-right").addClass("icon-chevron-down");
}).on('hide', function(){
    $(this).parent().find(".icon-chevron-down").removeClass("icon-chevron-down").addClass("icon-chevron-right");
});

$(".btn-switch").each(function() {
  var $thisButton = $(this);
  $thisButton.click(function() {
    $thisButton.toggleClass("btn-primary btn-danger");
    if ($(this).hasClass('btn-danger')) {
    $thisButton.html('<i class="icon-remove-circle icon-white"></i> Remove');
    $(this).parents('.thumbnail').find('.rental-count').val('1');
    $(this).parents('.thumbnail').find('input').change();
  } else {
    $thisButton.html('<i class="icon-ok-circle icon-white"></i> Add to Quote');
    $(this).parents('.thumbnail').find('input').val('');
    $(this).parents('.thumbnail').find('input').prop('checked', false);
    $(this).parents('.thumbnail').find('input').change();
  }
  });
});