Javascript in Airi child theme does not work [Solved]

I am using a child theme and i want to make a modification to the mobile view.
I have a menu item with a drop down attached. In mobile view, an arrow appears next to the menu name that displays/hides the submenu on click however it is quite small.
I want to attach the function on the menu name and have created the following code snippet

(function($) {
        'use strict'
    jQuery.event.special.touchstart = { setup: function( _, ns, handle ){ if ( ns.includes("noPreventDefault") ) { this.addEventListener("touchstart", handle, { passive: false }); } else { this.addEventListener("touchstart", handle, { passive: true }); } } };

    jQuery.event.special.touchmove = { setup: function( _, ns, handle ){ if ( ns.includes("noPreventDefault") ) { this.addEventListener("touchmove", handle, { passive: false }); } else { this.addEventListener("touchmove", handle, { passive: true }); } } };

    jQuery('#menu-main-navigation-new-1  li.products-list').toggle(shows,hides);

    function shows(event){
        jQuery('i.lastudioicon-down-arrow').addClass('lastudioicon-up-arrow active').removeClass('lastudioicon-down-arrow'); 

    function hides(event){
        jQuery('i.lastudioicon-up-arrow').addClass('lastudioicon-down-arrow').removeClass('lastudioicon-up-arrow active');       


Problem is, that this code is not working in wordpress at all. I have used this in the developers console and it works as desired.
I have used console.log() in different places to ensure that the file is being read or not and concluded that the code is being read after all.
The code is clearly en queued and visible at the front end which means that loading was not the issue.
What the problem is that the functionality does not work by default in mobile view.
I have resolved a script conflict, a non passive event handler issue and right now, nothing should be present to inhibit the functionality.
Any suggestions as to what could be wrong ?

tl;dr Jquery code added for mobile menu that works on click. It works when added to the console. It does not work when added to wordpress albeit it shows up as added.


You can try to add your jQuery code like I described in this topic:

Also you might want to check this link:

Kind Regards, Roman.
aThemes Support

1 Like

The problem was solved using Javascript with setTimeout .

1 Like