title: Replace function returning string with repeated characters in javascript
body: <p>consider following function</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function myFunction() {
    var html = "CR_557!#$&amp;amp;'()*+,-./:;&amp;lt;=&amp;gt;?@[]^_`{|}";
    var data = html.substring(0, 14);
    var newData = '&lt;span style="background-color:#F2E9B7"&gt;' + data + '&lt;/span&gt;';
    return html.replace(data, newData);
  }
  
  console.log(myFunction());</code></pre>
  </div>
  </div>
  </p>
  
  <p>the expected content for var <code>html</code> in the end should be:</p>
  
  <pre><code>"&lt;span style=\"background-color:#F2E9B7\"&gt;CR_557!#$&amp;amp;&lt;/span&gt;'()*+,-./:;&amp;lt;=&amp;gt;?@[]^_`{|}"
  </code></pre>
  
  <p>but for some reason i am getting this:</p>
  
  <pre><code>"&lt;span style=\"background-color:#F2E9B7\"&gt;CR_557!#CR_557!#$&amp;amp;amp;&lt;/span&gt;'()*+,-./:;&amp;lt;=&amp;gt;?@[]^_`{|}"
  </code></pre>
  
  <p>the characters CR_557!# are getting repeated for some reason
  not sure why.</p>