I have been spinning my wheels on this for a while now. I have an object array constructed like this :
0: {name: "Coaches", isActive: true, locations: Array(13)}
1: {name: "Directors", isActive: false, locations: Array(13)}
2: {name: "Trainers", isActive: false, locations: Array(5)}
I have a nav menu and when mouse enters gets the text of the line item. Now I am trying to in my array compare that text to the name text so i can build the sub items of locations
        $('.nav ul').hide();
    $('.nav li').mouseenter(function () {                        
        $(this).children('ul').stop().slideDown('slow');
        var text = $(this).find('span').text();
        //console.log(text);
        var item = leftNavData.modules.findIndex(i => i.name.toLowerCase() === "coaches");
        var i = leftNavData.modules.find(x => x.name.toLowerCase() == text.toLowerCase());
        console.log(i);
        console.log(item);
    }).mouseleave(function () {
        $(this).children('ul').stop().slideUp('slow')
    });
The find always returns the same object the first one coaches even if I mouse over other elements.
The text is changing but the find always retuns the first object.
The findIndex is always 0.
Any Ideas or something that I have missed?
Thanks
 
    