title: How do I make list group item active without anchor tags?
body: <p>I want to style a <a href="http://getbootstrap.com/components/#list-group-basic" rel="nofollow noreferrer">basic list-group</a> item <code>active</code> to highlight it (change background color etc). Bootstrap supports the <code>active</code> class just through <a href="http://getbootstrap.com/components/#list-group-linked" rel="nofollow noreferrer">Linked items</a>.</p>
  
  <p>I have something like: </p>
  
  <pre><code>&lt;ul class="list-group"&gt;
    &lt;li class="list-group-item active"&gt;Cras justo odio&lt;/li&gt;
    &lt;li class="list-group-item"&gt;Dapibus ac facilisis in&lt;/li&gt;
    &lt;li class="list-group-item"&gt;Morbi leo risus&lt;/li&gt;
    &lt;li class="list-group-item"&gt;Porta ac consectetur ac&lt;/li&gt;
    &lt;li class="list-group-item"&gt;Vestibulum at eros&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>to make <code>Cras justo odio</code> style as active
  what is the best practice to do that?</p>