Preciso fazer que alguns inputs no meu form
da versão mobile fiquem ocultos e sejam exibidos ao clicar no botão chamado Busca avançada
criei um código jQuery
mais não está funcionando não sei o que estou fazendo de errado lembrando que estou usando bootstrap 4
segue os meus códigos:
HTML:
Tipo Periodo de informação 2 3 4 5 Número Ano Escolha um ano 2 3 4 5 Busque por termo Buscar <button class="d-block d-sm-none advanced-btn" onclick="myFunction()">Busca avançada <i class="fas fa-caret-down"></i></button>
SCSS:
.advanced-btn{
border: 0;
background-color: transparent;
outline: none;
}
@media (max-width: $screen-xs-min) {
.myDIV{
display: none;
}
}
JS:
function myFunction() {
var x = document.getElementsByClassName("myDIV");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}