title: Element not found
body: <p>I'm having a problem with an element not being found. I have this Ui-State from ui-router called <code>AuthDesc</code>, And for the <code>templateURL</code> I have this:</p>
  
  <pre><code>  &lt;head&gt;
      &lt;link rel="stylesheet" type="text/css" href="stylesheets/normalize.css" media="screen"&gt;
      &lt;link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'&gt;
  
    &lt;/head&gt;
    &lt;body&gt;
  
  &lt;textarea id="SimpleMDE"&gt;
  # This one autosaves!
  By default, it saves every 10 seconds, but this can be changed. When this textarea is included 
  in a form, it will automatically forget the saved value when the form is submitted.
  &lt;/textarea&gt;
  
    &lt;/body&gt;
  </code></pre>
  
  <p>And for the <code>Controller</code> I have this:</p>
  
  <pre><code>(function(angular) {
    var app = angular.module('ForumApp');
  
    app.controller('authDescCtrl', ["$scope", "$mdDialog", "$state", "$firebaseObject","refService","currentAuth",authDescCtrl])
  
    function authDescCtrl($scope, $mdDialog, $state, $firebaseObject,refService,currentAuth){
  
        $scope.topic = $firebaseObject(refService.ref().child("Topics"))
  
  
      $scope.goToPerson = function(person, event) {
        $mdDialog.show(
          $mdDialog.alert()
          .title('Navigating')
          .textContent('Inspect ' + person)
          .ariaLabel('Person inspect demo')
          .ok('Neat!')
          .targetEvent(event)
        );
      };
  
      $scope.goToTopic = function(avatar, date, email, title, uid, username, value) {
        $state.go("authHome.topic", {
          "AVATAR": avatar,
          "DATE": date,
          "EMAIL": email,
          "TITLE": title,
          "UID": uid,
          "USERNAME": username,
          "VALUE": value
        })
  
      }
  
    }
  
   new SimpleMDE({
              element: document.getElementById("SimpleMDE"),
              spellChecker: true,
              autosave: {
                  enabled: true,
                  unique_id: "SimpleMDE",
          },
      });
  
  })(angular);
  </code></pre>
  
  <p>You can see in the last couple lines of controller that there is a new MDE Generator, however the console states that the element cannot be found:</p>
  
  <blockquote>
    <p>SimpleMDE: Error. No element was found.</p>
  </blockquote>
  
  <p>I am confused. There is a <code>textarea</code> named <code>SimpleMDE</code>, but I do not know how is it not finding it. Here is a link to the code in the wild: <a href="https://ide.c9.io/amanuel2/fourm2" rel="nofollow">https://ide.c9.io/amanuel2/fourm2</a></p>
  
  <p>I am afraid that the Javascript loads before the HTML, so it doesn't recognize the texarea with ID <code>SimpleMDE</code>.</p>