jQuery defining click function overrides all click functions
<p>Here is my code:</p>

<pre><code>&lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" &gt;&lt;/script&gt;
&lt;script type="text/javascript" &gt;

$(document).ready(function() {

    var qtypes = ['Text','Area'];

    for(qt in qtypes){

        console.log('#submitQuestion' + qtypes[qt] + ' ' + qt);
        var name = '#submitQuestion' + qtypes[qt];
        $(name).click(function(){
            console.log('clicked ' + name);
        });
        $('#submitQuestion' + qtypes[0]).click();
    }

    $('#submitQuestion' + qtypes[0]).click();
    $('#submitQuestion' + qtypes[1]).click();

});


&lt;/script&gt;
&lt;input type="button" id="submitQuestionText" value="submit Question" /&gt;
&lt;input type="button" id="submitQuestionArea" value="submit Area" /&gt;
</code></pre>

<p>Results in the console output:</p>

<pre><code>#submitQuestionText 0
clicked #submitQuestionText
#submitQuestionArea 1
clicked #submitQuestionArea
clicked #submitQuestionArea
clicked #submitQuestionArea
</code></pre>

<p>Why is using a for loop overriding all click() functions?  I would expect to see the last two lines of the output to be:</p>

<pre><code>clicked #submitQuestionText
clicked #submitQuestionArea
</code></pre>
