I have been working on this HTML/CSS code and I am trying to change the style of a div using a JavaScript button click event so that the div becomes visible and clickable. However, despite my efforts, it doesn't seem to be working as expected.
Whenever I click the button, nothing happens at all. Can someone please assist me with this issue?
<button type="button" id="letsgo" onclick="letitGo()">Process</button>
<div id="textualdiv">blah blah blah</div>
Below is the script used for this functionality:
<script>
function letitGo()
{
document.getElementById("textualdiv").style.opacity = "1";
document.getElementById("textualdiv").style.pointerEvents = "auto";
}
</script>
Furthermore, here is the CSS styling for the div in a separate file:
#textualdiv {
z-index: 10;
background-color: white;
margin-bottom: 0%;
width: 70%;
text-align: center;
height: 50%;
min-width: 500px;
top: 10%;
display: block;
margin: 0 auto !important;
padding: 0;
position: relative;
opacity: 0;
pointer-events: none;
border-style: solid;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}