javascript - Javascript innerHTML out of scope issue?

Question

I was wondering why the following jsfiddle does not work. And if there is anyway for it to work. Any ideas would be appreciated. I would think since the html would include the variable name at the time, that it would work ... but it doesnt. Weird. I am using firefox, latest build.

What should happen: onclick should alert!

http://jsfiddle.net/VqA9g/125/

Answer 1

Your method call needs to quote the list_name.

Here's the edited script that works:

function example() {
    for ( var i = 0; i < list.length ; i++ ) {   
        var list_name = list[i];
        var div = document.getElementById('testing');
        div.innerHTML += "<txt onClick=\"test('" + list_name + "');\">" + list_name + "</txt><br>";
    }
}

With this little change, I can see the alerts working.

Answer 2

You forgot to enclose the words in quotes. So with your code it was passing as a variable, that was not defined. Here is an updated version:

http://jsfiddle.net/VqA9g/131/