Automatic line break in cell

<script type="text/javascript">
function  switchcontent()
{
  finalstr = '';
  l=10; //number of characters allowed per line
  originalstr=document.getElementById('thecell').textContent;
  copyoriginal=document.getElementById('thecell').textContent;
  if (copyoriginal.length>=10)
  {
    ltimes=Math.ceil(copyoriginal.length/l);
    for (i=1; i<ltimes; i++)
    {
      finalstr = finalstr + copyoriginal.substr(0,l) + '<br />';
      copyoriginal=copyoriginal.slice(l);
    }
    finalstr = finalstr + copyoriginal;
    replacestr='<a href="'+originalstr+'">'+finalstr+'</a>';
    document.getElementById('thecell').innerHTML=replacestr;
  }
}
</script>
<table><tr>
    <td id="thecell"><a href="http://longlonglonglonglonglonglonglonglong.url">
    http://longlonglonglonglonglonglonglonglong.url</a></td>
</tr></table>
<input type="button" value="add breaklines" onclick="switchcontent();" />

<style type="text/css">
.fixedtable{table-layout:fixed;overflow:hidden; width: 100px}  
.fixedcell{white-space:nowrap;overflow:hidden; width: 50px}
</style>

<table class="fixedtable"><tr>
    <td class="fixedcell"><a href="http://longlonglonglonglonglonglonglonglong.url">
    http://longlonglonglonglonglonglonglonglong.url</a></td><td>next col</td>
</tr></table>