I'm trying to add a class to an element within the main menu, but nothing is happening. I'm using Underscores starter theme, which has this in the header.php:
<?php
wp_nav_menu( array(
'theme_location' => 'menu-1',
'menu_id' => 'primary-menu',
'after' => '<span class="fa fa-times"></span>',
) );
?>
I then put this in the navigation.js file (also tried inline in the footer.php):
$(".menu-item-has-children .span").click(function() {
$(".menu-item-has-children .sub-menu").removeClass("toggled");
$(this).next(".sub-menu").toggleClass("toggled");
});
But nothing happens. I've also tried a simple:
$('body').click(function() {
alert("Yeah!");
});
And nothing happens there either. This does work:
window.onload = function() {
alert("Yeah!");
}
jQuery is loading:
<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
navigation.js is enqueued in functions.php:
function themename_scripts() {
wp_enqueue_style( 'themename-style', get_stylesheet_uri() );
wp_enqueue_script( 'themename-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20151215', true );
wp_enqueue_script( 'themename-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );
if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
wp_enqueue_script( 'comment-reply' );
}
}
add_action( 'wp_enqueue_scripts', 'themename_scripts' );
...So what basic error have I made?