Exception Unable to set property 'href' of undefined or null reference when
<p>The problem is this: I try to dynamically change the innerHTML and href of an LINk in a function <code>CheckCookie</code> which is executed in body - onload. Here is the function: </p>

<pre><code>function checkCookie()
{
    var username = getCookie("username");

    if (username != null &amp;&amp; username != "")
    {       
        document.getElementById("firstlink").href = "http://localhost:8080/newLogIN/probalassfinalwithoutstyle.html";
        document.getElementById("firstlink").innerHTML = "Go to my lesson";       
    }
}
</code></pre>

<p>also I have another jquery function which is executed on document ready </p>

<pre><code>function DropDown(el) {
    this.dd = el;
    this.initEvents();
}
DropDown.prototype = {
    initEvents: function() {
        var obj = this;

        obj.dd.on('click', function(event) {
            $(this).toggleClass('active');
            event.stopPropagation();
        });
    }
}


$(function() {

    var dd = new DropDown($('#dd'));

    $(document).click(function() {
        // all dropdowns
        $('.wrapper-dropdown-3').removeClass('active');
    });

});
</code></pre>

<p>In my body I've got this</p>

<pre><code>&lt;body onload="CheckCookie()"&gt;
    &lt;div id="dd" class="wrapper-dropdown-3"&gt;LoGG
        &lt;ul class="dropdown"&gt;
            &lt;li&gt;&lt;a href="#" id="firstlink"&gt;Gismo Account&lt;/a&gt; &lt;/li&gt;

    &lt;/div&gt;
&lt;/body&gt;
</code></pre>

<p>Everything works as I want but when I add </p>

<pre><code>document.getElementById("dd").innerHTML = "Hi," + getCookie("username");  
</code></pre>

<p>to change the InnerHtML of dd div it gives me an exception </p>

<p>SCRIPT5007: Unable to set property 'href' of undefined or null reference </p>
