title: Replace Text with Image - JavaScript (getElementsByClass)
body: <p>I have a span:</p>
  
  <pre><code>&lt;span class="attr attr-value"&gt;Brand Name&lt;/span&gt;
  </code></pre>
  
  <p>And I want to replace that text with an image, based on the text</p>
  
  <p>Here is what I have:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
   var oldHTML = document.getElementsByClass('attr-value').innerHTML;
   var filename = oldHTML.toLowerCase().replace(/ /g, '-').replace(/([^0-9a-z-])/g,'');
   var newHTML = "&lt;img src='http://www.example.com/" + filename + ".jpg'&gt;";
   document.getElementsByClass('attr-value').innerHTML = newHTML;
  &lt;/script&gt;
  </code></pre>
  
  <p>What am I doing wrong here?</p>