title: JQuery css function not persisting its change
body: <p>I have a "button-bar" div that I only want to show once the user has clicked on a "settings" button. I have set the button-bar div to display:none in my css. Unfortunately, when the settings button is clicked, the div shows up for a split second, then goes away. Does anyone know why this might be happening? My current code:</p>
  
  <pre><code>$(document).ready(function() {
      $('#settings').on('click', function() {
          $('#button-bar').css('display', 'inline-block');
      });
  });
  </code></pre>