Caching a JS selector then only using it once
My general rule of thumb is to cache a selector lookup within a given function so you only look it up once for each function invocation, but to not cache it globally.

If something was being called hundreds or thousands of times in a loop, you would want to cache it outside the loop just for common sense efficiency.

Caching things globally is pretty much never needed for user event types of things because the performance of looking up a few objects in the DOM is super fast when compared to any sort of user action time.  In other words, you wouldn't be able to tell the difference so you might as well go with the most maintainable and reliable code which avoids unnecessary globals.