angularjs - Angular element remove does not work ? -

i have service responsible show loading bar on screen. add loading bar dynamically

coremodule.provider('$loading', function () {     this.$get = ['$document', function ($document) {          var element = angular.element('<div id="loading" class="loading">' + '<img src="../styling/img/loading.gif" alt="loading .... ">' + '</div>');          return {             inprogress:function (message) {                  $document.find('body').append(element);             },              finish:function () { //                $document.find('body').remove(element);     <- not work  //                $document.find('body').remove('#loading');   <- neither 1 !!             }         }     }]; }); 

however finish function work @ all. remove element body. ideas ?

you can use element.remove() - see http://docs.angularjs.org/api/angular.element available jquerylight methods.