javascript visibility를 가지고 있는 클레스 질문

JavaScript
1

.choiceSubPage
{
position : relative;
z-index : 120;
visibility : hidden;
}
.choiceSubPage.show
{
visibility : none;
}

지금 제가 choiceSubPage라는 class에서 버튼을 누르면 나타나고 그 안에서 버튼을 또 누르면 사라지는 기능을
구현하고 있는데요

거꾸로 visibility가 처음에 none이고 show에 hidden 기능이 있으면 정상작동은 되는데 거꾸로 하면 안되네요 ㅠㅠ

조언 부탁드리겠습니다. ㅠㅠ

아 그리고 추가적으로 javascript 에서의 구현은
document.GetElementByClassID(“name”)[0].classList.add(“show”);
document.GetElementByClassID(“name”)[0].classList.remove(“show”);
형식으로 하고 있구요…

그 아래에 있는 class들은 position이 fixed로 되어있습니다.

2

보이고 안보이고는 visible 과 hidden으로 처리 하셔야 합니다 고로 .show 클래스에는 visible로 하셔야 합니다