Mootools highlight() bug ?

Using highlight() to create the mouseover effect, however, when clicked, the elements do not get the new class background color.

Mootools v1.2.3

The css:

.marked{
	background-color:red;
	border:1px dashed red;
	}

The html:

<ul class="clickable">
	<li>Item 1</li>
	<li>Item 2</li>
	<li>Item 3</li>
</ul>

The javsascript:

window.addEvent('domready', function() {
	var clickable=$$('.clickable li');
	clickable.setStyle('cursor', 'pointer');

	clickable.addEvent('mouseover',function(event){
		this.highlight('#006699');
	});
			
  	clickable.addEvent('click',function(event){
		this.addClass("marked");
  	});
});

Demo

When you click on the items, you will see that whilst they do get the borders as defined in the css class, they don't get the background color.

The javascript solution:

Get the elements current background color and use it as the second parameter in highlight() 
window.addEvent('domready', function() {
	var clickable=$$('.clickable li');
	clickable.setStyle('cursor', 'pointer');

	clickable.addEvent('mouseover',function(event){
		var bg_color=this.getStyle('backgroundColor');
		this.highlight('#006699',bg_color);
	});
			
  	clickable.addEvent('click',function(event){
		this.addClass("marked");
  	});
});

Demo