Error document.getElementById is null
<p>I'm implementing some javascript functions that dynamically create a new iframe and the relative button to delete it.</p>

<p>This is the code that I wrote to create the button:</p>

<pre class="lang-js prettyprint-override"><code>function addButton(iframeId, num) {
    var butt = document.createElement('button');
    var butt_text = document.createTextNode(num);
    butt.appendChild(butt_text);
    butt.id = num + 100;
    butt.onclick = function() { removeButton(butt.id); removeIframe(iframeId, butt.id); }
    document.body.appendChild(butt);
    numButt++;
}
</code></pre>

<p>and this is how I call it:</p>

<pre><code>addElement(iframe.id, cont);
</code></pre>

<p>The parameter "cont" is a counter that starts from 1 and is increased in the function to create the new iframe, so the first button will be named 101 and it eliminates iframe #1, the second button will be named 102 and it eliminates frame #2, and so on.</p>

<p>"numButt" is a counter that starts from 0 and counts how many buttons are created, so to know the id of the last created button.</p>

<p>The function to remove the button is this and it works fine:</p>

<pre class="lang-js prettyprint-override"><code>function removeButton(buttonId) {
    butt = document.getElementById(buttonId);  
    if (butt) { 
        butt.parentNode.removeChild(butt);
    }
}
</code></pre>

<p>Now I want to reassign the onclick event of the button. Since if I remove the iframe #3 all the iframes.id with id higher than 3 will be renamed with this function (I need to do renaming because my resizeIframe function works with consequential IDs):</p>

<pre class="lang-js prettyprint-override"><code>function renameIds(elim) {
    for (i = 1; i &lt;= cont; i++) {
        if (i &gt; elim) {
            document.getElementById(i).id = i-1;
        }
    }
}
</code></pre>

<p>I need to change the onclick event of the button so that button named 104 will eliminate iframe #3, button 105 will eliminate frame #4 and so on.</p>

<p>I make this in the removeIframe function but it doesn't work, since Firefox error console returns me "document.getElementById(a) is null":</p>

<pre class="lang-js prettyprint-override"><code>function removeIframe(iframeId, buttId) {
    iframe = document.getElementById(iframeId);
    var a;
    if (iframe) {
        iframe.parentNode.removeChild(iframe);
        renameIds(iframeId);
        cont--;
        resizeIframe();
        for (a = 101; a &lt;= 100+numButt; a++) {
            if (a &gt; buttId) {
                document.getElementById(a).onclick = function() { removeButton(a); removeIframe(a-101, a); }
            }
        }
    }
}
</code></pre>

<p>What's the problem??
Thanks in advance!</p>
