document.getElementById("tabs") has no properties

[afmanuk]

Hi, I am trying to learn how to make a tab system for a website I have this javascript so far

Code: Select all

var tabs = [['News', 'This Is The News Tab'], ['Events', 'This Is The Events Tab'], ['Other', 'This Is The Other Tab']];

function draw_tabs()
{
    var length = tabs.length;
    var html = null;
    
    for(var i = 0; i < length; i ++) {
        html += "<span id=\"" + tabs[i][0] + "\" onclick=\"select_tab(" + i + ")\">" + tabs[i][0] + "</span>";
    }
    
    document.getElementById("tabs").innerHTML = html;
}

draw_tabs();

I also have the firefox extension Web Developer and it gives the error document.getElementById("tabs") has no properties

My html is this

Code: Select all

<div class="tabs" id="tabs">&nbsp;</div>
<div id="tab_content">&nbsp;</div>

Any idea why I get this error? It works fine in my other apps

[Rakuli]

Where abouts on the page do you have the javascript? You would need to be including the function call after the HTML you have given or else it won't be found as it doesn't exist in the document at that point.

[afmanuk]

Haha. Oh God, of course!
Oops
Thanks!

[Rakuli]

LOL - common mistake I've tried desperately to put the clumps of hair back in after realising I've made this error.