title: on("click", event) firing without clicking
body: <p><strong>There are similar questions on this topic but their answers didnt work for my problem.</strong></p>
  
  <p>Im trying to use jQuery's <code>on("click")</code> to fire a function that simply changes the class of the id which was clicked. But the function is called when the page is loaded and then if you click on what should fire the function it wont.</p>
  
  <p>Here is the html:</p>
  
  <pre><code>&lt;nav&gt;
      &lt;ul&gt;
          &lt;li id="all" class="tab-current"&gt;&lt;a&gt;&lt;span&gt;All Departments&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p>And here the js:</p>
  
  <pre><code>var $all = $("#all");
  $all.on("click", function(){
      tabClicked("all");
  });
  </code></pre>
  
  <p>I've also tried this:</p>
  
  <pre><code>$all.on("click", tabClicked("all"));
  </code></pre>
  
  <p>And this is the function:</p>
  
  <pre><code>function tabClicked(input){
      //do some stuff here
  }
  </code></pre>
  
  <p>Any ideas? Thanks in advanced! :)</p>