title: dynamic slideToggle with AngularJS
body: <p>I'm pretty new to AngularJS and I'm trying to migrate the following piece of jQuery code to AngularJS.</p>
  
  <pre><code>$('#someid').on('click', 'someclass', function() {
    $(this).next().slideToggle('fast');
  });
  </code></pre>
  
  <p>My HTML that I began converting to AngularJS looks something like</p>
  
  <pre><code>&lt;ul id='someid'&gt;
    &lt;li ng-repeat="..."&gt;
      &lt;ul&gt;
        &lt;li class="someclass"&gt;{{ ... }}&lt;/li&gt;
        &lt;li style="display:none"&gt;the part that will be slideToggle'd&lt;/li&gt; 
      &lt;/ul&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Elements are added to the ng-repeat list dynamically when the user interacts with the app, hence the jQuery.on().  I'm OK using an unstable version of AngularJS if it helps.</p>
  
  <p>How should I rewrite the jQuery fragment in AngularJS?  I've tried a few things now including adding a new directive, playing with ng-animate, etc.  But when I added jQuery code into my ng controller, that started to look ugly -- I'd like to avoid anything hybrid.</p>
  
  <p>Thanks a lot!</p>