title: document.getElementById is not returning any value
body: <p>I am playing around with TypeScript and am trying to create a script that will fetch the HTML values of a div with class and id.</p>
  
  <p>However, I am able to get the result for a class but I cannot fetch the result using <code>getElementById</code>.</p>
  
  <p>The html looks as following:</p>
  
  <pre><code>&lt;button (click)="selectDiv()"&gt;select div&lt;/button&gt;
  
     &lt;div class="container"  id="main-wrapper"&gt;   
  &lt;p&gt;
   Fetch me
  &lt;/p&gt;
  &lt;/div&gt; 
  </code></pre>
  
  <p>And the <code>explore.ts</code> file</p>
  
  <pre><code>selectDiv() {
       //create a new HTMLElement from nativeElement
      var hElement: HTMLElement = this.elRef.nativeElement;
  
      //now you can simply get your elements with their class name
     var allDivs = hElement.getElementsByClassName('container')[0];
  
     var getSection = &lt;HTMLElement&gt;document.getElementById["main-wrapper"].innerHTML;
  
      console.log(allDivs);
      console.log(getSection); // returning nothing
    }
  </code></pre>
  
  <p><code>getsection</code> is giving me an error as follows:</p>
  
  <blockquote>
    <p>ERROR TypeError: Cannot read property 'innerHTML' of undefined</p>
  </blockquote>