Why my onclick doesn't work?
<p>I am new on this field, and have tried this for a long time. You can see my simple version here:
<a href="https://plnkr.co/edit/YeahrG28bT2izX8gMKor?p=preview" rel="nofollow noreferrer">https://plnkr.co/edit/YeahrG28bT2izX8gMKor?p=preview</a></p>

<p>Could you tell me why my onclick here doesn't work? My button is the <code>2signUp</code> botton, Thanks!</p>

<p>js:</p>

<pre><code>var app = angular.module('myApp', []);

app.controller('mainControl', function($scope) {
  $scope.logged = false;
  $scope.visiter = true;
  var sub1 = document.getElementsByClassName("haha")[0];
  sub1.onclick=function(){
    $scope.logged = !$scope.logged;
  }
})
</code></pre>

<p>html:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html lang="en" ng-app='myApp'&gt;
&lt;head&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"&gt;&lt;/script&gt;
    &lt;script src="MainViewController.js"&gt;&lt;/script&gt;
&lt;/head&gt;
&lt;body ng-controller="mainControl"&gt;
        &lt;div ng-show="logged"&gt;
            &lt;button&gt;1Sign Up&lt;/button&gt;
            &lt;button&gt;Log In&lt;/button&gt;
        &lt;/div&gt;
        &lt;div ng-show="visiter"&gt;
            &lt;button class="haha"&gt;2Sign Up&lt;/button&gt;
            &lt;button&gt;Log In&lt;/button&gt;
        &lt;/div&gt;
        &lt;div ng-show="logged"&gt;
          hello
        &lt;/div&gt;

&lt;/body&gt;
</code></pre>