Putting Euro Symbol in Inner Text HTML using Javascript

Had a problem today whereby I tried to insert a euro symbol into the innertext of a div using javascript.

First I tried the actual euro symbol

e.g.

document.getElementById('theelementid').innerText ="€" + value;

This results in the user agent outputting an unrecognised symbol in place of the euro

Then I tried using the html escape code for the euro symbol:

i.e.

document.getElementById('theelementid').innerText ="€" + value;

But that resulted in the € being displayed verbatim by the browser as the DOM automatically encodes special characters such as the ampersand

Finally, I actually escaped it using the unicode value

i.e.

document.getElementById('theelementid').innerText ="\u20AC" + value;

and it worked like a treat.