title: getElementsByClassName > get children
body: <p>I have this HTML code:</p>
  
  <pre><code>&lt;div id="channels_0"&gt;
     &lt;div id="channels"&gt;
        &lt;h4 class="date"&gt;&lt;span id="date"&gt;Sat 22nd Sep&lt;/span&gt; @ 
        &lt;span id="time"&gt;12:45&lt;/span&gt;&lt;/h4&gt;
        &lt;h3 class="teems"&gt;&lt;span id="date"&gt;Swansea City v Everton &lt;/span&gt;&lt;/h3&gt;
        &lt;h4 class="tv"&gt;&lt;span id="mychannels"&gt;&lt;/span&gt;Sky Sports 2/Sky Sports 2 HD&lt;/h4&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have this JS:</p>
  
  <pre><code>document.getElementById('channels').innerText)
  </code></pre>
  
  <p>Which outputs:</p>
  
  <pre><code>Sat 22nd Sep @ 12:45
  Swansea City v Everton
  Sky Sports 2/Sky Sports 2 HD
  </code></pre>
  
  <p>How do i get a handle and output the individual items like: mychannels, or teems or time or date
  i.e. i need to get the children, how is this done?</p>
  
  <p>I have tried:</p>
  
  <pre><code>document.getElementById('channels').getElementsByTagName('date').value; 
  </code></pre>
  
  <p>and </p>
  
  <pre><code>document.getElementsByClassName('date').value;
  </code></pre>
  
  <p>and others, but still cant seem to get a handle on it.</p>