A CodePen by ElmahdiMahmoud. Progressbar | jQuery UI - Progressbar | jQuery UI with custom data attribute.

index.html

<div class="progressbar" data-value="20"></div>
<div class="progressbar" data-value="40"></div>
<div class="progressbar" data-value="60"></div>
<div class="progressbar" data-value="80"></div>
<div class="progressbar" data-value="100"></div>

script.js

/*
	Progressbar | jQuery UI with custom data attribute - May 21, 2013
	(c) 2013 @ElmahdiMahmoud 
*/  
$(function () {
    function initBar(_this) {
        _this.progressbar({
            value: parseInt(_this.data('value'))
        });
    }

    $('.progressbar').each(function () {
        initBar($(this));
    });


});

style.css

body {
    background-color: rgba(200,0,0,.75);
    padding: 10px;
}
div {
  width: 450px;
  margin: 0 auto 5px;
}
div.progressbar { border-radius: 0; border-color: #f5f5f5; }

div.ui-progressbar-value {
  border: 0;
background-color:white;
background-image: linear-gradient(90deg, rgba(200,0,0,.5) 50%, transparent 50%),
linear-gradient(rgba(200,0,0,.5) 50%, transparent 50%);
background-size: 30px 30px;
  
}