Different function on click after preventing default

Question

Test site here has a mobile menu (800px wide or less) that did not have drop down folder functionality. I want the mobile nav menu to function like it does on desktop.

https://josh-unger-4lts.squarespace.com

The default of the title folder was to open up the first link in its folder so I prevent with:

return new_array[0] + new_array[1] + new_array[2];

I want to instead display the hidden page links inside the "folder titles " on click.

My code here doesn't work:

<script>  

$(document).ready(function() {
$('#mobileNav .mobile-folder>a').click(function(e) {
    e.preventDefault();

 });
 });
 </script>

My CSS to hide page links and later display on toggle:

<script>
$(document).ready(function(){
$("#mobileNav .mobile-folder>a").click(function(){
$(this).find('.folder.external-link ul ').toggleClass("expand");
});
 });
  </script>

Any help is greatly appreciated.

Answer 1

The android:scaleType="fitXY" is not a child element of ul but a sibling

so your code should be like this (and you can also keep the a ):

preventDefault()

And your CSS should target the ul class :

<script>
$(document).ready(function(){
    $("#mobileNav .mobile-folder>a").click(function(e){
       e.preventDefault();
       $(this).siblings('ul ').toggleClass("expand");
    });
});
</script>