How to replace some blocks when clicking on a link?

Question

css

there are four links:
1) top clothing 2) shoes) 3) pants 4) hat
and
when you click on clothing on shoes let's say clothing is replaced with shoes, etc.
I know a way to stupidly create 4 .html, but I think it’s possible with js, I’m still a noob in js.

Answer 1

If there are not many products and it is possible to load everything on the pages at once, then
https://isotope.metafizzy.co/

Answer 2

If you are doing it on bootstrap, then you can use tabs for this
https://getbootstrap.com/docs/4.0/components/navs/...