Tengo un cuadro de entrada de texto que hace 3 cosas, comienza con el botón 'Informar un error' cuando está cerrado, al hacer clic, se abre un cuadro de texto y el botón Informar un error se convierte en 'Cerrar'. Ahora quiero combinar el código de todos los JS a continuación para trabajar con el siguiente botón HTML, pero no puedo ver una forma clara de avanzar en esto. Cuando lo probé, mi funcionalidad desapareció, o el botón simplemente ya no cambia el texto.

Botón HTML.

 <button id="myBtnToReportABug" onclick="toggleReportForm()" type="button" class="btn btn-secondary float-right">{{#if report_form_closed }} Report A Problem {{else}} Close {{/if}}</button> </div>

JS:

 // changes text on 'report problem' button when form open function change() { var theButton = document.getElementById("myBtnToReportABug"); if (theButton.innerHTML == "Close") theButton.innerHTML = "Report A Problem"; else theButton.innerHTML = "Close"; } // clears text field onclick function clearFields() { document.getElementById("nameInput").value = ""; } // changes text on 'submit' back to original button text when report is made function changeSecond() { var theButton = document.getElementById("myBtnToReportABug"); if (theButton.innerHTML == "Close") theButton.innerHTML = "Report A Problem"; } function toggleReportForm() { var report_form_closed = document.getElementById("myBtnToReportABug"); }