Why does my variable change values?
<p>I have a simple <a href="http://jsfiddle.net/a9kG8/3/" rel="nofollow">jsfiddle</a> where I get the value of a div. </p>

<p>In the <code>$(document).ready(function(){})</code> section I get the text of the div just fine. When I try to use that value later on in a function, the value changes (unless I add <code>.innerHTML</code>). Why does the value of that variable change? In other words, why do I need to add <code>.innerHTML</code> when I call that variable later on?</p>

<p>thanks! </p>

<pre><code>&lt;div id="my_div"&gt;1&lt;/div&gt;

// Javascript/JQuery

$(document).ready(function(){ 
    var my_div = $("#my_div").text();

        alert(my_div);

        func();
    });


function func(){    
    alert(my_div); // why does the value change here...why???
        alert(my_div.innerHTML); // why do I need ".innerHTML' here???
};
</code></pre>
