I have this code:
elf='%0A';
document.getElementById('writebox').innerHTML=("hello there"+elf+"friend");
When the function that this is inside is called, the text that appears in the div is not a line break, but rather just "%0a". This confuses me, because inside another different function, elf works fine. Any ideas why?
Different encoding. %0A is URL-encoding of a newline, which you would use in (obviously) URLs. 
 would be the HTML-encoding of the same character that you would use in HTML, but it doesn't work, for a variety of reasons. To break a line in HTML, you can use <br> tag.
EDIT:
the problem wit a
<br />tag is that all i want is simply a new line.<br />creates WAY too much white space
No, it doesn't:
foo<br>
bar