Passing Variables To/From Function : <p>I am attempting to create a code that generates faces and displays them as part of an audited Coursera.com course. There are variables generated outside of the function that I would like to pass into it, and then get some out. My attempt:</p>

<pre><code>var numberOfFaces = 5;
var theLeftSide = document.getElementById("leftSide");
var theImg = document.createElement("img");
theImg.src = "smile.png";    

function generateFaces(numberOfFaces, theLeftSide, theImg) {

        for (i = 0; i &lt; numberOfFaces; i++) {
            var leftPosition = Math.floor(Math.random() * 400);

            var topPosition = Math.floor(Math.random() * 400);

            theImg.style.left = leftPosition + "px";
            theImg.style.top = topPosition + "px";
            theLeftSide.appendChild(theImg.cloneNode());

        };
        var theRightSide = document.getElementById("rightSide");
        var leftSideImages = theLeftSide.cloneNode(true);
        leftSideImages.removeChild(leftSideImages.lastChild);
        theRightSide.appendChild(leftSideImages.cloneNode(true));
        return leftSideImages;
    }

window.onload = generateFaces;
</code></pre>

<p>This didn't feel right as I wasn't defining any variables in the </p>

<pre><code>window.onload = generateFaces;
</code></pre>

<p>Next, I tried a button</p>

<pre><code>&lt;input id="clickMe" type="button" value="clickme" onclick="generateFaces(numberOfFaces, theLeftSide, theImg);" /&gt;
</code></pre>

<p>A push in the right direction would be appreciated. The code works if I define the variables in the function, which is an accomplishment so far!</p>
