JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<div class="container">
  <div class="col-lg-12">
    <div class="col-lg-4 col-md-4 col-sm-4 question-list">
      <ul class="list-group">
        <li class="2" data-toggle="collapse" data-target="#2" aria-expanded="false">Link</li>
        <div id="2" class="tab-content collapse mobile-answer">
          <p class="header">content of link</p>
          <div class="answer">
            <p>Bunch o' content here</p>
          </div>
        </div>
        
        <li class="3" data-toggle="collapse" data-target="#3" aria-expanded="false">Link</li>
        <div id="3" class="tab-content collapse mobile-answer">
          <p class="header">content of link</p>
          <div class="answer">
            <p>Bunch o' content here</p>
          </div>
        </div>

      </ul>
    </div>
  </div>
</div>

CSS

li {
  list-style-type: none;
}

/* .list-group li:active {
  border-left: 3px solid #ce2523;
  padding-left: 7px;
  color: #000000;
}

.list-group li:focus {
  border-left: 3px solid #ce2523;
  padding-left: 7px;
  color: #000000;
} */

.liborder {
  border-left: 3px solid #ce2523;
  padding-left: 7px;
  color: #000000;
}

JavaScript

$('.tab-content').on('hide.bs.collapse', function () {
    $(this).prev('li').removeClass('liborder');
})

$('.tab-content').on('show.bs.collapse', function () {
     $(this).prev('li').addClass('liborder');
})