title: how to get value of h2 tag for a div inside other div with id using javascript
body: <p>I have a div with id, which has some other div's without id.</p>
  
  <p>Some thing like:</p>
  
  <pre><code>&lt;div class="mainDivClass" id="mainDiv"&gt;
      &lt;div class="subDivClass"&gt;
          &lt;h2&gt;one&lt;/h2&gt;
                Hello One!!
      &lt;/div&gt;
  
      &lt;div class="subDivClass"&gt;
          &lt;h2&gt;two&lt;/h2&gt;
                Hello Two!!
      &lt;/div&gt;
  
      &lt;div class="subDivClass"&gt;
           &lt;h2&gt;three&lt;/h2&gt;
                Hello Three!!
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>In my javascript, I am looping through above div like:</p>
  
  <pre><code>var divLists = document.getElementById('mainDiv').firstChild.childNodes; 
  
  for (var i = 0; i &lt; tabLists.length; i++) { 
    var anchor = divLists[i].firstChild; 
    var iconFile;
  
    if(i==0)
    {
      iconFile = 'details.png';                     
    }
  
    else
    {
      iconFile = 'search1.png';
     }
    anchor.style.backgroundImage = 'url(' + iconFile + ')'; 
    anchor.style.backgroundRepeat = 'no-repeat';        
    anchor.style.backgroundPosition = '1px 2px';        
    anchor.className = 'toplevel-tab';
  } 
  </code></pre>
  
  <p>As shown, I am setting iconFile variable on value of i. So for i = 0, it would be details.png while for all others, it would be search1.png.</p>
  
  <p>Now, I want to decide the iconFile variable value based on the h2 value of the element. 
  That is, if h2 is banana, banana.png will go in iconFile but if h2 is orange, orange.png will be selected. </p>
  
  <p>How to get h2 value inside javascript ?</p>
  
  <p>Thanks for reading!!</p>
  
  <p>Nik</p>