Question

I am using some javascript to dynamically change a webpage, and I am trying to make it change some html as well, but if I have the html in the javascript, it won’t even execute the beginning parts. Here is my javascript:

function Home()
{
    document.getElementById("title").innerHTML=("Home");
    document.getElementById("bodyfill").innerHTML=("Home stuff here");

    var newHTMLHome = "a href="#" title="Home" class="active">Home/a>";

    document.getElementById('hometab').innerHTML = newHTMLHome;

    var newHTMLUser = "a href="javascript:User()" title="Home" class="active">Home/a>";

    document.getElementById('usertab').innerHTML = newHTMLUser;
}

function User()
{
    document.getElementById("title").innerHTML=("User");
    document.getElementById("bodyfill").innerHTML=("User stuff here");

    var newHTMLHome = "a href="javascript:Home()" title="Home" class="active">Home/a>";

    document.getElementById('hometab').innerHTML = newHTMLHome;

    var newHTMLUser = "a href="#" title="Home" class="active">Home/a>";

    document.getElementById('usertab').innerHTML = newHTMLUser;
}

I am trying to get it to change the active tab dynamically, which is what this is supposed to do, but it doesn’t, any ideas why? If you need more code let me know. Thanks in advance!

Edit: Had to change the links code, just assume the tags are correct in that case

Answer 1

Your problem is that you don’t escape special characters in string, for example:

var newHTMLHome = "<a href="#" title="Home" class="active">Home</a>";

Instead, try something like:

var newHTMLHome = '<a href="#" title="Home" class="active">Home</a>';

Please take a look here or hereto fully understand what happens.