title: phonegap-facebook-plugin on WebApp, JS error
body: <p>I am building a Ionic based mobile application and I am using the <a href="https://github.com/Wizcorp/phonegap-facebook-plugin" rel="nofollow">phonegap-facebook-plugin</a> to login with facebook. I have managed to install the plugin on both android and ios and it works. However, while trying to use it for the webapp, I am having dificulties making it work. I will outline my setup then outline the error:</p>
  
  <p><strong>login.html</strong></p>
  
  <pre><code>&lt;div id="fb-root"&gt;&lt;/div&gt;
  &lt;div class="event listening button" ng-click="login();"&gt;Login with Facebook&lt;/div&gt;
  </code></pre>
  
  <p><strong>app.js</strong></p>
  
  <pre><code>angular.module('app', ['ionic', 'app.controllers', 'app.services'])
  
  .config(function($stateProvider, $urlRouterProvider) {
  
    $stateProvider
  
      //First page
      .state('login', {
        url: '/login',
        templateUrl: 'templates/login.html',
        controller: 'LoginCtrl'
      });
  </code></pre>
  
  <p><strong>controllers.js</strong></p>
  
  <pre><code>angular.module('app.controllers', [])
  
  .controller('LoginCtrl', function($scope){
  
      $scope.login = function () {
          if (!window.cordova) {
              var appId = prompt("Enter FB Application ID", "");
              facebookConnectPlugin.browserInit(appId);
          }
          facebookConnectPlugin.login( ["email"], 
              function (res) {                                                
                  //if successfull                                            
                  if (JSON.stringify(response['authResponse']['accessToken']) != null){
                      alert("True");
                      $location.path('/home').replace();
                  }
                  else{
                      //redirect back
                  }
  
              },
              function (res) { 
                  //if error
                  alert(JSON.stringify(response)) 
              }
          );
      }
  });
  </code></pre>
  
  <p>In the <a href="https://github.com/Wizcorp/phonegap-facebook-plugin/blob/master/www/js/facebookConnectPlugin.js" rel="nofollow"><strong>facebookConnectPlugin.js</strong></a>, I have a line of code which gets the error "<strong>Uncaught TypeError: Cannot read property 'appendChild' of null</strong>", specifically <strong>Line 174</strong>:</p>
  
  <pre><code>document.getElementById('fb-root').appendChild(e);
  </code></pre>
  
  <p>I know this must be due to the DOM, but can't seem to get past it.</p>
  
  <p>Any help would be great, thanks :)</p>