I've been using the code below to truncate text in a div when it's too long.

It copies the style and text from the div to another hidden div in the page. It then iterates through shortening the string until the second div reaches the desired height.

The code works, except for the part where it copies across the styles. The alerts just show a blank message box. The font and font size are set in an external CSS file.

I've been Googling all morning, but this appears to be the only way that I can find to get the styles.

Does anyone know why it isn't working?

Code:
function checkFont(el) {
***var divCheck = document.getElementById("font-checker");
***var txtCheck = document.getElementById(el);

***divCheck.style.width = txtCheck.offsetWidth+"px";
***alert(txtCheck.style.fontSize);
***alert(txtCheck.style.fontFamily);
***divCheck.style.fontSize = txtCheck.style.fontSize;
***divCheck.style.fontFamily = txtCheck.style.fontFamily;

***var orgText = txtCheck.innerHTML;
***divCheck.innerHTML = txtCheck.innerHTML;

***var orgHeight = txtCheck.offsetHeight;
***var divHeight = divCheck.clientHeight;

***var stringLen = orgText.length - 1;
***var newString = orgText;

***while (divHeight>orgHeight+20) {
***	newString = orgText.substring(0, stringLen) + "...";
***	
***	divCheck.innerHTML = newString;
***	divHeight = divCheck.clientHeight;
		
***	stringLen = stringLen - 1;
***}
***txtCheck.innerHTML = newString;
}
Thanks for any help.

0d085d