title: Angular element remove does not work ?
body: <p>I have a service which is responsible for show a loading bar on the screen. I add the loading bar dynamically like this </p>
  
  <pre><code>coreModule.provider('$loading', function () {
      this.$get = ['$document', function ($document) {
  
          var element = angular.element('&lt;div id="loading" class="loading"&gt;' + '&lt;img src="../styling/img/loading.gif" alt="loading .... "&gt;' + '&lt;/div&gt;');
  
          return {
              inProgress:function (message) {
  
                  $document.find('body').append(element);
              },
  
              finish:function () {
  //                $document.find('body').remove(element);     &lt;- does not work 
  //                $document.find('body').remove('#loading');   &lt;- neither this one does !!
              }
          }
      }];
  });
  </code></pre>
  
  <p>However finish function does work at all. It does remove the element from the body. Any ideas ?</p>