title: jquery how to observe any change in the dom for a specific selector
body: <p>I have a function that looks for the existence and count of the class .dirty on a webpage. It would have to start at a certain point but at that point, I'd like for jQuery to observe for css changes in the DOM and rerun this function. Is this possible? Could I use <code>on()</code> for this? Like:</p>
  
  <pre><code>$(document).on('change','.dirty', dosomething);
  </code></pre>
  
  <p>although I know that's different than what change is used for. Basically, the change I want is any <code>addClass</code> or <code>removeClass</code> for '<strong>dirty</strong>'.</p>
  
  <p><strong>sample markup</strong></p>
  
  <p>looking for observing both adding / removing .dirty on 'top-level-menu' so that I can propogate change</p>
  
  <pre><code>&lt;div class="top-level-menu dirty" data-menu-global-id="12828"&gt;
    &lt;input id="menu-name-global-id-12828" size="30" type="text" value="Some value here"&gt;
  &lt;/div&gt;
  </code></pre>