title: How to change background color of the selected item in a list
body: <p>How do I change the background color of the selected item in a list.
  I'm not sure whether this is done in the CSS or my script.</p>
  <pre><code>&lt;script id=&quot;INLINE_PEN_JS_ID&quot;&gt;
  $(document).ready(function () {
  
    $('.accordion-list &gt; li &gt; .answer').hide();
  
    $('.accordion-list &gt; li').click(function () {
      if ($(this).hasClass(&quot;active&quot;)) {
                                        
         if (event.target.closest('a')) {
          // an &lt;a&gt; was clicked
          return;
          }   
        $(this).removeClass(&quot;active&quot;).find(&quot;.answer&quot;).slideUp();
        
      } else {
          
        $(&quot;.accordion-list &gt; li.active .answer&quot;).slideUp();
        $(&quot;.accordion-list &gt; li.active&quot;).removeClass(&quot;active&quot;);
        $(this).addClass(&quot;active&quot;).find(&quot;.answer&quot;).slideDown();
        $(&quot;.accordion-list &gt; li.style.backgroundColor = &quot;red&quot;;
      }
      return false;
    });
  
  });
  &lt;/script&gt;
  </code></pre>