Hfrhyu

I'm trying to display popup information from overlapping polygons similar to this question, but instead of a click, I'm using the mouse over to identify my popup. In areas that have overlapping polygons, I'd like to display the Name and Description from all polygons. I'm trying to incorporate the correct answer to my particular case, but I'm just not understanding the logic.

My Original Code

 //change info window on hover
 map.on('mousemove', function(e) 
 var neighborhood = map.queryRenderedFeatures(e.point, 
 layers: ['Neighborhood_layer']
 );

 if (neighborhood.length > 0) 
 document.getElementById('pd').innerHTML = 
 "<p><em>Name: " + neighborhood[0].properties.Name +
 "<p><em>Name: " + neighborhood[0].properties.Description +
 "</em></p>";
 else 
 document.getElementById('pd').innerHTML = '<p>Hover over a Neighborhood</p>';
 
 );
 });

My Attempt

 //change info window on hover
 map.on('mousemove', function(e) 
 var neighborhood = map.queryRenderedFeatures(e.point, 
 layers: ['Neighborhood_layer']
 setHTML(e.features.map(function(neighborhood) return feature.properties.Name; ).join(', '))
 setHTML(e.features.map(function(neighborhood) return feature.properties.Description; ).join(', '))
 );

 if (neighborhood.length > 0) 
 document.getElementById('pd').innerHTML = 
 "<p><em>Name: " + neighborhood[0].properties.Name +
 "<p><em>Name: " + neighborhood[0].properties.Description +
 "</em></p>";
 else 
 document.getElementById('pd').innerHTML = '<p>Hover over a Neighborhood</p>';

 );
 );

UPDATED Attempt
I'm not understanding the logic, but if I change neighborhood [0] to neighborhood [1], I'm able to identify most overlapping features but not all...

 //change info window on hover
 map.on('mousemove', function(e) 
 var neighborhood = map.queryRenderedFeatures(e.point, 
 layers: ['Neighborhood_layer']
 setHTML(e.features.map(function(neighborhood) return feature.properties.Name; ).join(', '))
 setHTML(e.features.map(function(neighborhood) return feature.properties.Description; ).join(', '))
 );

 if (neighborhood.length > 0) 
 document.getElementById('pd').innerHTML = 
 "<p><em>Name: " + neighborhood[1].properties.Name +
 "<p><em>Name: " + neighborhood[1].properties.Description +
 "</em></p>";
 else 
 document.getElementById('pd').innerHTML = '<p>Hover over a Neighborhood</p>';

 );
 );

neighbourhood is an Array of features under the mouse, so where you are grabbing the first only with neighbourhood[0] you can iterate over or concatenate.