Execute function on each item click, but also once on page load
<p>I have a page with boxes and I want a function to run on each box click. Additionally, I want the function to run ONCE on page load.  </p>

<p>(The idea is that the function "updates the state", and I want to update on each click, but also on page load - to initialize the state, so to speak.)</p>

<p>Normally, I do this like so:</p>

<pre><code>$('.box').click(function() {
    // do something
}).first().click();
</code></pre>

<p>So I attach the handler to each <code>.box</code> click event, and then I get the first <code>.box</code> element and trigger the click event on it. </p>

<p>This approach works, but it feels kind-of clumsy. How do you tackle this problem?</p>
