I have a homepage with a navigationBar on top of the Viewport contains two buttons.
One is the default selected home button which calls/displays home.html. The other for example is Ubuntu which calls UbuntuTutorial.html.
When home is selected, the home-buttons bottom-border is colored while the bottom-border from Ubuntu-button is transparent to show the user that he is actually at the home-section of my website
Now, from a professional view, is it a common pattern to create two nearly similar CSS where the only difference is the colored bottom-border of the clicked button (i.e home or ubuntu) or, which I would prefer, fetch the current displayed html-file and color the bottom-border of the specific button with js... avoiding multiple css where just one line differs. (But also keeping in mind that some(high amount, low amount?) of user disabled js..)
Everything is kept, in my opinion, professional. I am using external CSS and external JS-Files.