title: Change Nested Span class using Javascript
body: <p>I am having issues changing the span class when it's nested inside the button element with Javascript. </p>
  
  <p>I am trying to make it appear like this <a href="http://www.bootply.com/128062#" rel="nofollow">http://www.bootply.com/128062#</a> and I have verified the CSS works.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;button id="submitbutton" class="btn btn-primary btn-lg" type="submit" onclick="onclickFunction();"&gt;
      &lt;span id ="submit_span" class=""&gt;&lt;/span&gt; Submit&lt;/button&gt;
  </code></pre>
  
  <p><strong>JavaScript</strong></p>
  
  <pre><code>function onclickFunction() {
      document.getElementById('submitbutton').className = 'btn btn-lg btn-warning';
      document.getElementById('submitbutton').innerHTML = 'Loading...';
      document.getElementById('submit_span').className = 'glyphicon glyphicon-refresh glyphicon-refresh-animate';
  }
  </code></pre>