Search the Community

Hi, I have a menu trigger button that appears on a page in more than one place, so i've used classes as the selectors. I've worked out how to loop through the classes and toggle different functions to be called using an if else statement, but I can't seem to get this to work with tween max tweens. I've commented out a tween in the code below, which does the same as the vanilla javascript that is inside the same function, but i can't get it to work. How do i get a tween to be called as a current target? Any help would be awesome. Emily As well as the codepen above, here is the JS code for quick reference. var clicked = false; // sets the clicked state var $mainMenuButton = document.getElementsByClassName('desktopmenubutton'); // button to be clicked function newColor(e) { e.currentTarget.style.background = "black"; } function originalColor(e) { e.currentTarget.style.background = "red"; // e.currentTarget.TweenMax.to($mainMenuButton, 1, {background: 'red'}); } // loop through instances of the class and add functions dependent on the click state for (h = 0; h < $mainMenuButton.length; h +=1) { $mainMenuButton[h].addEventListener('click', function(e) { if (clicked === false) { newColor(e); clicked = true; // changed the clicked state } else { originalColor(e); clicked = false; } }); }