en mi formulario tengo inputs ocultos que mostrar al llenar el campo sin incluir la etiqueta form me sale todo bien pero cuando la incluyo, lleno el campo y le doy en continuar me aparecen y desaparecen los inputs al instante, lo que quiero es que los inputs se muestren y no se vuelvan a ocultar.
<script>
function OPCION(cual) {
var elElemento=document.getElementById(cual);
if(elElemento.style.display == 'block') {
elElemento.style.display = 'none';
} else {
elElemento.style.display = 'block';
}
}
</script>
</head>
<body>
<h3>Registro de Cliente o Dependencia</h3>
<form action="">
Cliente o Dependencia<input type="text">
<button href="javascript:void(0);" onclick="OPCION('demo1')">Continuar</button>
<div id="demo1" style="display:none;"><div id="segundo">
Compra<input type="text">
<br>
Fecha<input type="date">
<br>
</div>
<div id="tercero">
zona<input type="text">
<br>
dia<input type="text">
<br>
numero de ruta<input type="text">
<br>
<button type="submit" values="Registrar" name="registrar3">Registrar</button>
<br>
</div>
</form>
</body>
</html>
agradecería mucho su ayuda
