ClassList in JS not working..

[Pranab]

i’m trying to hide the txt field if the Q word has the particular class..after clicking nothing happens..

this is the jsfiddle link – https://jsfiddle.net/pranab/Lvfzgcc2/

here is the js..

var test = document.getElementById("icon");
test.addEventListener("click",function(){
    var txt = document.getElementById("text");
    loadClass();
})

function loadClass(){
    if(txt.classList.contains("newClass")) txt.classList.remove("newClass");
    else txt.classList.add("newClass");
}

[Shikkediel]

The var txt is limited to the scope of the event listener, so it is an unknown value inside the loadClass function. Try like this, raising the scope:

var test = document.getElementById("icon"), txt;

test.addEventListener("click", function() {
    txt =

...

[Shikkediel]

Or you could pass it as a parameter of course…

var test = document.getElementById("icon");

test.addEventListener("click", function() {
    var text = document.getElementById("text");
    loadClass(text);
});

function loadClass(txt) {
    if (txt.classList.contains("newClass")) txt.classList.remove("newClass");
    else txt.classList.add("newClass");
}

Or is that called an argument… I never know. :-/

[Pranab]

thanks @Shikkediel..in my case, the txt variable act like a local scope that’s why it’s not working..

[Author]

Posts