How to automatically call a JavaScript that modify a value before show this value? -

i new in javascript , have following problem solve.

i have table contains td cell:

<td class= "datetoconvert" width = "8.33%">     <%=saldettaglio.getdatacreazione() != null ? saldettaglio.getdatacreazione() : "" %> </td> 

this retrieve string object , show cell

the problem retrieved string represent date having following horrible form: 20131204 , have convert following form: 2013-12-04.

so thinking create javascript work when value retrieved.

my problem is: how can automatically call javascript before show value td cell? (so show modified output in desidered form)

edit 1:

so have create thid javascript function page:

function convertdata() {     var tds = document.queryselectorall('.datetoconvert');     [].slice.call(tds).foreach(function(td) {         td.innertext = td.innertext.replace(/(\d{4})(\d{2})(\d{2})/, '$1-$2-$3');     });  } 

but don't work because never enter in function (i see using firebug javascript debugger). why? missing? maybe have call explicitly in way in td cell?

of course better fix backend method make return proper format. since have no control on try use this:

var tds = document.queryselectorall('.datetoconvert'); [].slice.call(tds).foreach(function(td) {     td.textcontent = td.textcontent.replace(/(\d{4})(\d{2})(\d{2})/, '$1-$2-$3'); }); 

check demo below.

var tds = document.queryselectorall('.datetoconvert');  [].slice.call(tds).foreach(function(td) {      td.textcontent = td.textcontent.replace(/(\d{4})(\d{2})(\d{2})/, '$1-$2-$3');  });

<table>      <tr>          <td class= "datetoconvert" width = "8.33%">              20131204           </td>          <td class= "datetoconvert" width = "8.33%">              20140408           </td>      </tr>  </table>