JavaScript Global Variable Question? Options

[scorks]

So I have the following JS function:

CODE

var globalTD;

function toggleOverlay(element){
    globalTD = element;
    
    var overlay = document.getElementById('overlay');
    var specialBox = document.getElementById('specialBox');
    overlay.style.opacity = .8;
    if(overlay.style.display == "block"){
        overlay.style.display = "none";
        specialBox.style.display = "none";

    } else {
        overlay.style.display = "block";
        specialBox.style.display = "block";
    }
}

function addText() {
    var localTD = globalTD;
    var text = document.getElementById('textToAdd').value;
    localTD.innerHTML += text;
    toggleOverlay();
}

and it works fine, but the "element" that I pass in to my toggleOverlay function is actually a TD element. I want to store the original contents of the TD element using another global variable, to use it in the deleteText function like this:

CODE

var globalTD;
var global2;

function toggleOverlay(element){
    globalTD = element;
    global2 = element.innerHTML;
    var overlay = document.getElementById('overlay');
    var specialBox = document.getElementById('specialBox');
    overlay.style.opacity = .8;
    if(overlay.style.display == "block"){
        overlay.style.display = "none";
        specialBox.style.display = "none";

    } else {
        overlay.style.display = "block";
        specialBox.style.display = "block";
    }
}

function addText() {
    var localTD = globalTD;
    var text = document.getElementById('textToAdd').value;
    localTD.innerHTML += text;
    toggleOverlay();
}

function deleteText() {
    var localTD = global2;
    localTD.innerHTML = localTD;
    toggleOverlay();

}

But it won't work for some reason. I believe it has something to do with my "element.innerHTML" line in the "toggleOverlay" function, but I'm not sure why it won't work. Any suggestions?

[scorks]

Nevermind, I've figured out a different way of doing it using substrings. Thanks anyways!

[CharlesEF]

I think your original problem was because of this line: 'localTD.innerHTML = localTD;'. localTD comes from global2 and global2 only contains the innerHTML of the cell, not the element object. You should have used 'globalTD'.innerHTML, as long as you are still working with the same element.

[Christian J]

I'll add that no element parameter is passed when you call toggleOverlay() from inside addText() or deleteText():

CODE

function addText() {
    toggleOverlay();
}

resulting in a script error when toggleOverlay() tries to access element.innerHTML.