[Verbal]

есть скрипт и форма

<script type="text/javascript">
var maxLength = 160;
var buttonId = "XplodePage_ctl03_btnSubmit";
var btnButton;
var txtTextarea;
var openTag = "<span style='color:red'>";
var closeTag = "</span>";
$(document).ready(
    function(){
		txtTextarea = $('#txtShortDescription');
		btnButton = $('#'+buttonId);
		txtTextarea.bind("input", function(){
			ChangeElementsState();
		})
	}
)

function CountSymbols(){
	return txtTextarea.val().length;
}

function ChangeElementsState(){
	if (CountSymbols() >= maxLength){
		btnButton.attr("disabled", "disabled");
		str = txtTextarea.val().substr(0, maxLength);
		str += openTag + txtTextarea.val().substr(maxLength) + closeTag;
		txtTextarea.html(str);
		number = maxLength - CountSymbols();
		$("#count").html(number);
	}
	else{
		number = maxLength - CountSymbols();
		$("#count").html(number);
		btnButton.removeAttr("disabled");
	}
}
window.onload=function(){
	ChangeElementsState();
}
</script>
<form>
<textarea id="txtShortDescription" rows="10">asdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasdasdasdaasda</textarea><br />
<span id="count"></span><br />
<input id="XplodePage_ctl03_btnSubmit" type="submit" value="submit">
</form>

при вводе больше 160 символ добовляется строчка text---<span style='color: red;'>---text---</span>
либо text---<span style='color: red;'>---text---</span>
но он не раскрашивает текст в красный, что тут не атк и как изменить?