title: jQuery UI: How to change the color of a ProgressBar?
body: <p>I've set up a simple jQueryUI progressbar:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(function() {
          $("#progressbar").progressbar({
                  value: 35
          });
      });
  &lt;/script&gt;
  
  &lt;div id="progressbar"&gt;  &lt;/div&gt;
  </code></pre>
  
  <p>Now, I'd like to color the of the bar based on it's value (e.g. &lt;10 red, &lt;50 yellow, >50 green). How do I do this?</p>
  
  <p>Note: There are <a href="https://stackoverflow.com/questions/1247660/how-to-change-the-color-size-of-one-progress-bar">similar questions</a>, but the answers were not clear enough to help me get things done. Hopefully, someone can point out an easier way or provide more detailed instructions. Thanks.</p>