Solution 1 :

Sounds like what you need is just to add a click handler like so

function appeardiv() {
  const acceptBox = document.getElementById("acceptbox3");
  acceptBox.style.display = "block";
  acceptBox.onclick = () => acceptBox.remove();
}

If you are not familiar with arrow functions, you may also use ordinary functions:

  acceptBox.onclick = function() { acceptBox.remove() };

Also, if you need to add more than one handler, you may use

  acceptBox.addEventListener(() => acceptBox.remove());

instead.

The result is (let me decrease the timeout, though):

window.onload = function() {
  setTimeout(appeardiv, 1000);
}

function appeardiv() {
  const acceptBox = document.getElementById("acceptbox3");
  acceptBox.style.display = "block";
  acceptBox.onclick = () => acceptBox.remove();
}
.accept_square3 {
  background-color: rgb(255, 0, 0);
  position: fixed;
  top: 55.9%;
  left: 43.2%;
  height: 5vw;
  width: 13vw;
  display: none;
}
<div id="acceptbox3" class="accept_square3"></div>

Solution 2 :

Not sure if I understand what you mean here. If you want to hide a div if cliccked, this should do the trick:

("#yourDiv").on("click", function() { ("#yourDiv").hide() });

Problem :

I’ve finally managed to make a div popup after a certain time in JS but the problem is, I can’t get the div to disappear, I want to make it so the div disappear after being clicked but, how?

Sorry for asking but I’ve been looking for ages for something as simple as it sounds but I can’t seem to figure out how to make a div clickable and then make it disappear when clicked thus I suppose don’t have any important code to show.

Edit: It seems like showing some code is still important but it’s quite simple though, just some code for making a div appear and how it should look. So here it is:

window.onload = function() {
  setTimeout(appeardiv, 30000);
}

function appeardiv() {
  document.getElementById("acceptbox3").style.display = "block"
}
.accept_square3 {
  background-color: rgb(255, 0, 0);
  position: fixed;
  top: 55.9%;
  left: 43.2%;
  height: 5vw;
  width: 13vw;
  display: none;
}
<div id="acceptbox3" class="accept_square3"></div>

Okay, I think this was all of the script.

Comments

Comment posted by Example

Use this event

Comment posted by Pranoy Sarkar

The reason behind you are not able to find because your question is little vauge, search for something like this: how to register a click event listener in javascript,How to hide an element by javascript. Its always hard at first time because of unfamiliarity of the right keywords, best of luck. Other folks: Downvoting without reason leads new user frusted

Comment posted by Ratic

Okay sorry for the late reply but I got it working so when clicked it gets removed but may I ask since I still have a bit of trouble understanding JS. How do I make it so more than one div gets removed by the click? Sorry if you already answered this in the comment but I’m quite bad at JS language.

Comment posted by YakovL

@Ratic well, basically you set a click handler which is a function:

Comment posted by Ratic

Alright, this finally somewhat worked, thank you so much, took forever to finally get this done.

By