title: Changing the inner html with javascript
body: <p>I have this divs in my html</p>
  
  <pre><code>&lt;img src="images/cocina1.jpg" name = "main_img" alt="alternate_text" height="250" width="150" /&gt;
  &lt;div class="imgbox" id="thumbnail_1"&gt; &lt;a href="#" onclick="changeTo1()"&gt;&lt;img src="images/cocina1.jpg" alt="alternate_text" height="250" width="150" /&gt; &lt;/a&gt; &lt;br /&gt;
  &lt;p&gt;Medico1&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and the following JS</p>
  
  <pre><code>function changeTo1(){
  
      var newP = "some Paragraph"
      document.getElementById('id_descripcion_txt').innerHTML = newP;
  
      document.main_pic.src = "images/medico1.jpg"
  
      document.getElementById('thumbnail_1').innerHTML = " &lt;a href=\"medicos/medico0.html\"&gt;&lt;img src=\"images/cocina0.jpg\" alt=\"alternate_text\" height=%22250%22 width=\"150\" /&gt; &lt;/a&gt; &lt;br /&gt; &lt;p&gt;Medico0&lt;/p&gt; "
  
  
  }
  </code></pre>
  
  <p>Now, after clicking on the image that calls changeTo1(), the first part of the JS works: the 'id_descripcion_txt' does changes its innerHTML to "some Paragraph", but the other 2 statements, of changing main_pic src and the "thumbnail_1" innerHTML to something else don't work. </p>
  
  <p>Any ideas?
  Thanks</p>