For the visibility I'd use a (non-persistent) object and a boolean, this way you can use the default visibility of Mx.
For updating this boolean and calling this function I would either use the HTML snippet (for an easy function call) or build a small custom widget. See: https://docs.mendix.com/howto6/scaffold-a-widget-with-the-yeoman-widget-generator
Andrew I think the issue you are having is that the javascript is not executing when the UI is updated. You can change this widget/code to update when the entity is refreshed. But a much better way is to do this based on a boolean being changed and the widget then executing when the boolean is set to true for instance. Take a look at the following widget, it will make certain fields editable or not based on a boolean. You could use the same technique as this widget but execute javascript function when a variable is true.
https://appstore.home.mendix.com/link/app/3160/First-Consulting/EditableByCondition
You can use the subscribe method in the client api to subscribe to an attribute change:
https://apidocs.mendix.com/6/client/mx.data.html#.subscribe
I hope this helps
Simon