Angular jqLite on $destroy not working

Question

I have a div called MyDiv and am bootstraping Angular manually to it (due to some limitations from a legacy system). In a particular case, I would like that on $destroy I do some further processing. I am using the below snippet, however it seems that it doesn't trigger anything - the console logging is not working :(

angular.element(document.querySelector('#MyDiv')).on('$destroy', function() { 
     // do something
     console.log("test");
});

Can someone tell me what I am doing wrong? This is the first time I am relying on jqLite as usually I use the full jQuery. I am using this in a controller not a directive.

Additional Detail:

I've also tried using the below, however I get this error in the console: Error: [jqLite:nosel] Looking up elements via selectors is not supported by jqLite!. This used to work when I was loading AngularJS after jQuery but i had to change the order to load angular first, and therefore have to rely on jqLite.

angular.element('#MyDiv').on('$destroy', function() {
        alert("Test");
    });

Note - if there is a way to do this using native js that is fine.

Thanks