Hi, can you help me to find what I am doing wrong?
I want to have a particular div hidden by default and show it after clicking on “Finish the order”.
My HTML:
<h4 class=”order-toggle” onclick=”showOrderForm”>Finish the order</h4>
<div id=”order-form-hidden”> …here is the order form… </div>
…and the script added:
<script type=”text/javascript” src=”show_hide_order_form.js”></script>
CSS:
.order-toggle {
display: block;
cursor: pointer;
}
#order-form-hidden {
display: none;
}
Javascript:
function showOrderForm() {
var x = document.getElementById(“order-form-hidden”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}
}
I also tried it in this way:
function showOrderForm() {
$(“#order-form-hidden”).toggle();
}
It does not work.
I made another script for something else, added it in the same way, and it works properly.
I also tried not to hide the div element by default, it did not help.
I have no more ideas… Thanks for help 🙂