title: Avoid flickering when replacing element content using innerHTML
body: <p>I have something like this on my site, to make things a bit more difficult for spam harvesters. By default the site shows "noob (at) me (dot) com", but then JavaScript replaces this text with the actual email address.</p>
  
  <pre><code>&lt;span id="email"&gt;noob (at) me (dot) com&lt;/span&gt;
  
  &lt;script type="text/javascript" src="email.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
    document.getElementById('email').innerHTML = emailProducingFunction();
  &lt;/script&gt;
  </code></pre>
  
  <p>This works. However, the problem is that sometimes, the original text is shown for a split second before JS turns to the real email, causing a brief "blinking" effect when the site loads.</p>
  
  <p>Is it possible to avoid this somehow?</p>
  
  <p>One "solution" is to have the email element hidden using CSS, and then use JS to make it unhidden. However, this is not a good solution because the site should also be compatible with browsers that have CSS enabled but JS disabled.</p>