Estoy construyendo un div de lectura más o plomo menos con HTML y javascript vainilla. Todo funciona, pero tengo que hacer clic en el botón dos veces por algunas razones para mostrar el texto, y desde allí funciona muy bien.

Entonces, el problema es que se debe hacer clic dos veces en el botón al principio para mostrar el contenido. A partir de ahí funciona muy bien.

Archivo HTML

 <div id="test"> <p>Hello World</p> </div> <button onclick="test()" id="testBtn">Read more</button>

En la prueba del archivo css se display:none

archivo JS

 var test = document.getElementById("test"); var btnText = document.getElementById("testBtn"); if (test.style.display !== "none") { btnText.innerHTML = "Read more"; test.style.display = "none"; } else { btnText.innerHTML = "Read less"; test.style.display = "inline"; } }