Object oriented javascript bug
<pre><code>       var U = function(){
            this.div = document.createElement('DIV');
            this.div.id= 'oooofffff';
            this.div.innerHTML = '&lt;form action=""&gt;&lt;input type="file" name="trainingReport"  /&gt;&lt;input type="submit" value="Upload" id="Upload" /&gt;&lt;/form&gt;';
            document.body.appendChild(this.div);
            $(this.div).css({'text-align':'center','padding-top':'25px'});
            $('input#Upload',this.div).button();
            $(this.div).dialog({
                    title:'Upload Summer Training Report',
                    resizable:false,
                    position:['center',300],
                    show:'blind',
                    hide:'explode',
                    autoOpen:false
                });
        }
        U.uploadReport = function(ApplicationID){
            console.log(this.div); //outputs undefined
            $(this.div).dialog("open");
        }
        $(document).ready(U);
</code></pre>

<p>what is wrong with my object? when i call <code>U.uploadReport()</code> function, it doesn't see <code>this.div</code>object. What should i do to fix it?</p>

<p>Note: please don't offer that i can use <code>$('#oooofffff').dialog('open')</code> </p>

<p><strong>edit</strong>:
version 2:</p>

<pre><code>var U = function(){
            var that = this;
            that.div = document.createElement('DIV');
            that.div.id= 'oooofffff';
            that.div.innerHTML = '&lt;form action=""&gt;&lt;input type="file" name="trainingReport"  /&gt;&lt;input type="submit" value="Upload" id="Upload" /&gt;&lt;/form&gt;';
            $(document).ready(function(){U.initialize()});


            that.uploadReport = function(ApplicationID){
                console.log(that.div);
                $(that.div).dialog("open");
            }
            that.initialize = function(){
                document.body.appendChild(that.div);
                $(that.div).css({'text-align':'center','padding-top':'25px'});
                $('input#Upload',that.div).button();
                $(that.div).dialog({
                    title:'Upload Summer Training Report',
                    resizable:false,
                    position:['center',300],
                    show:'blind',
                    hide:'explode',
                    autoOpen:false
                });
            }
            return that;
        }();
</code></pre>
