title: jQuery event listener for the insertion of an element specific class
body: <p>I'm trying to dynamically add some CSS classes to some elements that I don't have control over the creation of. I know that the divs I'm looking for will be added like this: <code>mydiv.appendChild(resdiv)</code>. However, I cannot add code at that point at which they're created. I know that every instance of this div that is dynamically added will have a specific CSS class (let's call it <code>output-class</code>). I could theoretically add CSS rules to that specific class, but I'd rather not - it would result in the duplication of a lot of styles.</p>
  
  <p>What I want to do is fire an event as soon as a div with the <code>output-class</code> class is added to the page. I'm trying to add some more CSS classes on the fly. Here's what I have so far:</p>
  
  <pre><code>jQuery('body').on('DOMNodeInserted', ".output-class", function(event) {
      var el = $(this);
      el.addClass('my new class');
      // do some more manipulation of the new div (el).
  });
  </code></pre>
  
  <p>However, as far as I can tell, this callback is never called. What am I doing wrong?</p>