I have followed the read more tutorial and it doesn't work.

Hi there and ty so I did it again and I have used the edited templates from velo and again even though the code is correct and shows no errors does not do anything once on my site. I have tried other browsers too …
the boxes are their, the hand scrolls over but the tabs do not change.

$w.onReady( function () {

const yellowColor = “#E7AE01” ; // For selected tab
const whiteColor = “#FFFFFF” ; // For other tabs

$w( '#DNButton' ).onClick(() => { 
    $w( '#DNStatebox' ).changeState( "DNState" ); 
}); 

$w( '#keyfButton' ).onClick(() => { 
    $w( '#DNStatebox' ).changeState( "KeyState" ); 
}); 

$w( '#specButton' ).onClick(() => { 
    $w( '#DNStatebox' ).changeState( "SpecState" ); 
}); 

$w( '#photoButton' ).onClick(() => { 
    $w( '#DNStatebox' ).changeState( "PhotoState" ); 
}); 


$w( "#DNStatebox" ).onChange((event) => { 

const buttonNames = [ “DN” , “keyf” , “spec” , “photo” ];

    buttonNames.forEach(buttonName => { 

let button = $w( “#” + buttonName + “Button” ); // e.g. $w(“#keyboardsButton”)
let state = buttonName + “State” ; // e.g. keyboardsState

if (event.target.currentState.id === state) {
button.style.backgroundColor = yellowColor;
} else {
button.style.backgroundColor = whiteColor;
}
});
});
});