Jquery Not Working On Elements Inside Ng-view

I'm new to angular, been trying to fix this for about an hour now but can't get it working. I have some html code:

<

Solution 1:

Best try to avoid using jQuery with AngularJS completely. Using both together in this fashion is a common mistake among those new to Angular, coming form a jQuery background. Here is a great answer on that topic: "Thinking in AngularJS" if I have a jQuery background?

You could just use ui bootstrap´s dropdown.

Alternatively, there are ngShow and ngIf. If you still want to use your own css class to hide it, just set the class with ngClass.

Then, you can use ngClick to recieve the click event.

Here is how it would look (HTML only, you dont even have to write any JS for this):

<liclass="notification-dropdown hidden-xs hidden-sm"ng-click="showDialog = !showDialog"><ahref="#"class="trigger"><iclass="icon-warning-sign"></i><spanclass="count">8</span></a><divclass="pop-dialog"ng-show="showDialog"><divclass="pointer right"><divclass="arrow"></div><divclass="arrow_border"></div></div><divclass="body"><!-- body content --></div></div></li>

EDIT : Added Code EDIT :working plunk