Finding the position of an Element in a html page using javascript

I am trying to get the position of an element in a html page using $document.find. But, it is always undefined.

Here is my code.

angular.module('MyApp', []).
controller('myController', function($scope, $document) {

var element = $document.find('my_element');
console.log(element.prop('offsetTop'));
console.log(element.offsetTop);
});

And this is html page.

<div ng-app="MyApp" ng-controller="driversController">
  <div id="my_element">Looping with ng-repeat:</div>
  .......
</div>

I do not want to use jquery along with angularjs. P;ease suggest a way to do this in angularjs.Thanks