Bootstrap 3 disable element click

Used for stackoverflow answer - http://stackoverflow.com/questions/36732889/disable-bootstrap-accordion-after-opening/36733164#36733164

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<div id="accordion">
  <a class="btn btn-primary" role="button" data-toggle="collapse" href="#collapseExample1">
    Link 1
  </a>
  <a class="btn btn-primary" role="button" data-toggle="collapse" href="#collapseExample2">
    Link 2
  </a>
  <a class="btn btn-primary" role="button" data-toggle="collapse" href="#collapseExample3">
    Link 3
  </a>
  <div class="collapse in" id="collapseExample1">
    This is the description 1
  </div> 
  <div class="collapse" id="collapseExample2">
    This is the description 2
  </div> 
  <div class="collapse" id="collapseExample3">
    This is the description 3
  </div> 
</div>

CSS

/* Latest compiled and minified CSS included as External Resource*/

/* Optional theme */
@import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');

body {
    margin: 10px;
}

JavaScript

$('#accordion').on('show.bs.collapse', function () {
    $('#accordion .in').collapse('hide');
});
var id = "collapseExample3"+$(".collapse.in").attr("id");
var elem = $('a[href="'+id+'"]');
elem.removeAttr("data-toggle");
$(".collapse.out").removeClass('collapse in');