Javascript Tutorial, please explain
<p>I am confused about the relationship between the</p>

<ol>
<li><code>var userInput</code> in line 3</li>
<li>the <code>userInput</code> in line 4</li>
<li>the id userInput in line 8</li>
</ol>

<p>Specifically, does the <code>userInput</code> in line 4 (on the right side of =) refer to the <code>var userInput</code> in line 3? or is it referring to the id userInput in line 8? </p>

<p>Also, how does the variable <code>userInput</code> in line 3 get used after it is assigned the <code>document.getelementbyID('userInput').value</code>?</p>

<pre><code>1  &lt;script type="text/javascript"&gt;
2  function changeText2(){
3   var userInput = document.getElementById('userInput').value;
4   document.getElementById('boldStuff2').innerHTML = userInput;
5  }
6  &lt;/script&gt;
7  &lt;p&gt;Welcome to the site &lt;b id='boldStuff2'&gt;dude&lt;/b&gt; &lt;/p&gt; 
8  &lt;input type='text' id='userInput' value='Enter Text Here' /&gt;
9  &lt;input type='button' onclick='changeText2()' value='Change Text'/&gt;
</code></pre>
