Store the value, not the expresion in JavaScript
<p>First of all, I'm not so sure about how to ask this question. I have an array of  elements:</p>

<pre><code>var buttons = publishedWork.getElementsByTagName('button');
</code></pre>

<p>and what I what is that each button changes its content from ▶ to ◼ and viceversa by clicking. The thing is that I don't know how many buttons will be in total, I intend to do it with a for:</p>

<pre><code>var currentButton;
for (var i = buttons.length; i;) {
    buttons[--i].onclick = function() {
        if (currentButton === buttons[i]) {
            currentButton.textContent = '▶';
            currentButton = null;
        } else {
            currentButton = buttons[i];
            currentButton.textContent = '◼';
        }
    }
}
</code></pre>

<p>But what this code does is that, no matter what button I click, it always changes the content of the first button, from which I get that is the expression <code>buttons[i]</code> the one that is stored in <code>currentButton</code>, and not the reference to the button itself.</p>

<p>So my question is:</p>

<p>is this a case to resolve by closures (a topic that I'm just beginning to grasp) or is there another solution?</p>

<p>Thanks beforehand. </p>
