title: AngularJS: element.show() in directive not working
body: <p>I have a directive (<a href="http://plnkr.co/edit/GiityBz2oOrWxP8gjTgZ?p=preview" rel="nofollow">see plunk</a>) that wraps a DIV with style <code>display:none</code> and after one second shows its content. I tried to make it display with element.show() and $(element).show() (including jQuery) but it never worked. The timeout works, what's wrong with this code?</p>
  
  <p>This is the HTML:</p>
  
  <p></p>
  
  <pre><code>    &lt;hideme&gt;
        Show this after one second
      &lt;/hideme&gt;
  </code></pre>
  
  <p></p>
  
  <p>and this is the javascript:</p>
  
  <pre><code>angular.module("app", []);
  
  function MyCtrl($scope) {}
  
  angular.module("app").directive('hideme', function($timeout) {
  
      return {
  
          restrict: 'E',
          template: '&lt;div style="display: none !important"&gt;&lt;/div&gt;',
          link: function(scope, element, attrs) { 
              $timeout(function() {
                    element.show();
              }, 1000);
          }
     };
  });
  </code></pre>