Yep - that would work well. Another approach may be to use media queries and ensure the menu is in its expanded mode when there is available screen width. I prefer this approach over the JS one since your page has to run extra code that may cause a few moments where the menu’s size flashes from collapsed to visible. You can certainly mitigate that, but the media query approach seems much simpler.

Good point. The tricky part is changing the responsive menu icon animation via css. The responsive menu can display open by adding the class ul#menu display block. However this does affect the responsive menu icon animation. Using css how would you change the state of the responsive menu icon from closed to open?