title: How to style the target of an event in Angular 2?
body: <p>I have added an even listener as proposed in <a href="https://medium.com/front-end-hacking/angular-2-a-quick-intro-about-template-syntax-121f9b160a64#.ktojriv7k" rel="nofollow noreferrer">this blog (section 3, event binding)</a> and in my class defining the component I do get hits on entering and exiting the mouse.</p>
  
  <pre><code>&lt;p class="title" (mouseenter)="unfold($event)" (mouseleave)="fold($event)"&gt;...&lt;/p&gt;
  </code></pre>
  
  <p>I also checked in the console that the element is what I expect it to and that it's children are accessible using the following jQuery script.</p>
  
  <pre><code>$(event.target)
    .children("p.title")
    .css("display", "block");
  </code></pre>
  
  <p>However, it doesn't go well when put into the fold function I'm connecting to my listener. I'm rather new with Angular (especially Angular2) so my guess is that I'm doing it wrong and that jQuery isn't supposed to be used at all. What should I use to set the class of my component?</p>
  
  <pre><code>unfold(event) {
    console.log("unfold");
    event.target
      .findTheTitleSomehow()
      .andAddCssToIt();
  }
  </code></pre>