<span>标记中的内容应如何对齐

如题,有如下HTML页面,需动态改变span元素中内容的对齐方式.
在<span>中加入<div>标记后,提示出错,但是始果直接写在网页中却可正常显示,
请各位解答.
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JScript">
function changeContent() {
    var sContent = "<span style='background:yellow;width:160px'><div align='center'>Content changed</div></span>";
    content.innerHTML = sContent;    
}
</SCRIPT>
</HEAD>
<BODY>
<span style='background:yellow;width:160px'><div align="center">Content changed</div></span>
<P id="content">This document is <B>very</B> short.</p>
<p><input type="button" value="更改内容" onclick="changeContent()"></p>
</BODY>
</HTML>