CSS媒体查询中的Javascript切换样式显示在媒体查询显示之外中断

I have an interactive element displayed only within the CSS media query which toggles the display of another element (the nav element) from none to block. Outside the media query (any display width greater than 580px) the nav element display is set as block. When I toggle the display within the media query and set the nav to display none, then re-size the browser to a width greater than 580px the nav element is still set to display none. How can I make so that toggling the display of nav within the media query will have no impact on its display outside of the media query?I have an interactive element displayed only wi