If I press the button with name send or id open-popup-btn it shows Bad Path whereas I handled the event in javascript where it should show a popup window whose transitions I have Mentioned in CSS file not attached here. Can Somene Exlpain why problem occurs and pressing the button doesn't display popup class elements as mentioned in script in codepen. I added type as button still not working.
document.getElementById("dismiss-popup-btn").addEventListener("click",function()
{
document.getElementsByClassName("popup")[0].classList.remove("active");
});
document.getElementById("open-popup-btn").addEventListener("click",function()
{
document.getElementsByClassName("popup")[0].classList.add("active");
});<div class="footer-section contact-form">
<h2>Contact Us</h2>
<br>
<div class="popup center">
<div class="icon">
<i class="fa fa-check"></i>
</div>
<div class="title">
Success!!
</div>
<div class="description">
Thank You For Contacting Us!!!
We'll be Replying you Right Back
Soon In Respect for Your Concern.
</div>
<div class="dismiss-btn">
<button id="dismiss-popup-btn">
Dismiss
</button>
</div>
</div>
<form name="contact-form">
<input type="email" name="email" class="text-input contact-input" placeholder="Your Email Address...">
<textarea name="message" class="text-input contact-input" placeholder="Your Message..."></textarea>
<button type="button" id="open-popup-btn" class="btn btn-submit contact-btn">
<i class="fas fa-envelope"> </i>
Send
</button>
</form>
</div>