I've set up a simple jQueryUI progressbar:

```
<script type="text/javascript">
    $(function() {
        $("#progressbar").progressbar({
                value: 35
        });
    });
</script>

<div id="progressbar">  </div>

```

Now, I'd like to color the of the bar based on it's value (e.g. <10 red, <50 yellow, >50 green). How do I do this?

Note: There are [similar questions](https://stackoverflow.com/questions/1247660/how-to-change-the-color-size-of-one-progress-bar), 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.