The problem with it is that (I think, I'm not sure), while it reads from left to right and top to bottom, the function add() has been called before even the [a] is resolved. You can fix that by enclosing it in a setTimeout to wait for the element to be loaded first before adding the new one.
add(msg) =>
setTimeout(() => {
a.html+=msg;
update(a_elem);
return "";
}, 1);
return '';
Another problem is when you use <span id="a_elem">\[a.html\]</span> for the [a], upon loading it on the HTML, the \[a.html\] is gone. It would only have the 'A', so even if you update it, you aren't updating anything (essentially saying that [a.html] has been evaluated and you are only updating 'A').