A nice and small plugin to create a semanticly step list.

Javascript

(function($) {
  $.fn.extend({
    steps : function() {
      $(this).find('li').each( function ( i ){ 
        $(this).prepend('<span class="step">'+(i+1)+'</span>');
      })
    }
  });
})(jQuery);

$('ol.steps').steps();

CSS

ol.steps li { 
  float: left;
  padding: 5px;
}
ol.steps li span.step { 
  border: 1px solid red;
  -webkit-border-radius: 20px;
  -moz-border-radius: 10px;
  line-height:18px;
  width: 20px;
  height:20px;
  margin-right: 5px;
  display:inline-block;
  text-align:center;
  color:#fff;
  font-weight:bold;
  background-color:#f00;
}