title: How to use angular.element find function to search by JQuery selector ?
body: <pre><code>describe("create a simple directive", function () {
  
  
      var simpleModule = angular.module("directivesSample", []);
  
  
      simpleModule.controller('Ctrl2', function ($scope) {
          $scope.format = 'M/d/yy h:mm:ss a';
      });
  
      simpleModule.directive("myCurrentTime", function ($timeout, dateFilter) {
  
          return function (scope, element, attr) {
              var format;
              var timeoutId;
  
              function updateTime() {
                  element.text(dateFilter(new Date(), format));
              }
  
              scope.$watch(attr.myCurrentTime, function (value) {
                  format = value;
                  updateTime();
              });
              function updateLater() {
                  timeoutId = $timeout(function () {
                      updateTime();
                      updateLater();
  
                  }, 1000);
              }
  
              element.bind('$destroy', function () {
                  $timeout.cancel(timeoutId);
              });
              updateLater();
          }
  
  
      });
  
  
      beforeEach(module('directivesSample'));
  
      var element = angular.element(
  
          '&lt;div ng-controller="Ctrl2"&gt;Date format:&lt;input ng-model="format"&gt; ' +
              '&lt;hr/&gt;Current time is: ' +
              '&lt;span class="timeout" my-current-time="format" id="timeout-render"&gt;&lt;/span&gt;' +
              '&lt;/div&gt;');
  
      var directiveScope;
      var scope;
      var linkedElement;
      var linkFunction;
  
      beforeEach(inject(function ($rootScope, $compile) {
          scope = $rootScope.$new();
          linkFunction = $compile(element);
          linkedElement = linkFunction(scope);
          scope.$apply();
      }));
  
      it("should define element time out", function () {
  
      var angularElement = element.find('span'); // &lt;-- element is not returned if set to   var angularElement = element.find('.timeout'); or var angularElement = element.find('#timeout-render'); 
  
          console.log(angularElement.text());
          expect(angularElement.text()).not.toBe('');
      })
  
  });
  </code></pre>
  
  <p>Having the above test, why am I unable to search for element by JQuery selector ? I am aware of the <a href="http://docs.angularjs.org/api/angular.element" rel="nofollow">limitations</a> in the documentation of find() method.But, I have checked out the angularUI project inspected the the usage of find() function as in <a href="https://github.com/angular-ui/bootstrap/blob/master/src/tooltip/test/tooltip.spec.js" rel="nofollow">here</a> </p>
  
  <pre><code> var tt = angular.element(elm.find("li &gt; span")[0]);   
  </code></pre>
  
  <p>and find out that the guys are using find to search element by jQuery elector not only tag name while I am not able to do so. Am I missing something ? </p>