title: Proper hook for domready with Ember.js
body: <p>What is the proper way to run JavaScript (in my case, jQuery) to modify a part of the DOM (an Ember view).</p>
  
  <p>Using <code>didInsertElement</code> in my view doesn't run betwen route context changes. E.g. from one post to another post.</p>
  
  <pre><code>App.PageView = Ember.View.extend({
      didInsertElement: function() {
          console.log(this.$().find('img').length);
      }
  });
  </code></pre>
  
  <p>Tried using the <code>afterRender</code> hook but same result. I assume it is because Ember only updates the Handlebars variables and not the view it self, since they are from the same model.</p>
  
  <pre><code>App.PageView = Ember.View.extend({
      didInsertElement: function() {
          Ember.run.scheduleOnce('afterRender', this, this.afterRenderEvent);
      },
      afterRenderEvent: function() {
          console.log(this.$().find('img').length);
      }
  });
  </code></pre>
  
  <p>I believe I got it working attaching an observer to the didInsertElement like this:</p>
  
  <pre><code>App.PageView = Ember.View.extend({
      didInsertElement: function() {
          Ember.run.scheduleOnce('afterRender', this, this.afterRenderEvent);
      }.observes('controller.images'),
      afterRenderEvent: function() {
          if (this.$()) {
              console.log(this.$().find('img').length);
          }
      }
  });
  </code></pre>
  
  <p>The observes is listening to my 'images' property on my model which seems to work. Is the the right way to do it? Seems a bit exccessive or what do I miss?</p>
  
  <p>As an example, my model templates have some images I need to modify.</p>