Javascript-форум - Проблема со стилями в firebug-lite

Добрый день. Столкнулся со следующей проблемой : при отладке в firebug-lite (сразу скажу, что он мне нужен для отладки на Android-e), а именно, когда загружаю страницу, то все стили на элементы имеющиеся на странице вижу, но, когда например добавляю элемент посредством javascript на страницу и назначаю при создании какой-либо класс со стилями данному элементу, то firebug-lite в этом элементе не видит стилей.
Вот код :

<!doctype html>
<html debug="true">
<head>
	<meta charset="utf-8">
	<title>firebug-lite</title>
	<style type="text/css">
		*{
			margin:0;
			padding:0;
		}
		div{
			height:50px;
			width:200px;
		}
		.par{
			background:#ccc;
		}
	</style>
	
	<!-- firebug-lite -->
	<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>

	<script type="text/javascript">
		window.onload = function()
		{
			var but = document.getElementById("but");
			but.onclick = function()
			{
				var p = document.createElement('P');
				p.className = 'par';
				var t = document.createTextNode('Параграф');
				p.appendChild(t);
				var div = document.getElementById('my_div');
				div.appendChild(p);
			}
		}
	</script>
</head>
<body>
	<div id="my_div">firebug-lite</div>
	<button id="but">Добавить параграф</button>
</body>
</html>

Ход выполнения данного скрипта, а так же сам отладчик firebug-lite можно посмотреть ЗДЕСЬ (при нажатии на кнопку "Добавить параграф", добавляется параграф с background, но стиль данного элемента firebug-lite не видит).

Причем это происходит именно когда назначаю класс (className), когда же назначаю непосредсвено стиль (style) все норм.

Скажите, может кто сталкивался с такой проблемой и знает как ее решить, либо есть какие-то соображения по этому поводу. Помогите пожалуйста разобраться.