JSFiddle - React, Tailwind, and code Playground

by dido

JavaScript

var $hasSubMenu = $('ul.main-nav li');
var $sportsList = $('.sports-list');

function toggleDropMenu() {
    $(this).find('.drop').toggle();
}

function descriptiveNameForSportsListBehavior() {
    var $this = $(this);
    $this
        .addClass('active-sport')
        .siblings()
        .removeClass('active-sport');

    $this.find('.sports-page')
        .addClass('show-page')
        .siblings()
        .removeClass('show-page');
}


$hasSubMenu.hover(toggleDropMenu);

$sportsList
    .show()
    .find('li')
    .hover(descriptiveNameForSportsListBehavior);