Develop Reference

Simulating Clicking a span/div element, not working

I'm trying to make an automation tool for google classrooms to auto-submit my work for me, instead of having to go through 1-by-1 (I have more than 100 to be turned in), and I'm trying to make js press the submit work/mark as done button. I've tried with all the divs and spans, but it doesn't do anything. here's some screen shots:
the code:
var elementsArray = document.getElementsByClassName("uArJ5e TuHiFd UQuaGc Y5sE8d M9Bg4d");
alert(elementsArray[0].innerHTML);
var span = elementsArray[0];
var click = new Event('click');
span.dispatchEvent(click);
Trying to run the script makes the alert pop up, but nothing else happens. No errors appear in the console, and I'm wondering why this isn't working. Any answers would be nice, thanks.

maybe you can try span.click()

Can you try with elementsArray[0][2] instead of elementsArray[0]?

How can I click 2 buttons simultaneously?

I work in a Call center (ticket based Support) and for me to get a ticket I need to click on 2 Buttons. the one that opens the tickets section, and the one that actually gets me a ticket. After i click on the Get_ticket class, the ticket box closes. So i need to start again to click on the "Tickets" Button, and then on Get_Ticket. Tickets button -> Get_ticket. And repeat and repeat. I want to tell Google console to help me with this. I found a way but it's not very friendly. I tried with the button.click function at a different interval but it's not working...If i put the function separately, it's working, but when I put the functions at the same time in Console, it's not working. Can you please give me an advice ? Those are the functions:
1.(click on TICKETS)
var button = document.getElementsByClassName("_1f8o8ru7")[0];
setInterval(function(){button.click();},2000);
2.(Click on GET TICKET)
var button2 = document.getElementsByClassName("_sl2x43m")[0];
setInterval(function(){button2.click();},2500);

The second interval should be added inside the first interval. I also recommend to use setTimeout, instead of setInterval.
setInterval(function(){
var button = document.getElementsByClassName("_1f8o8ru7")[0];
button.click();
setInterval(
function(){
var button2 = document.getElementsByClassName("_sl2x43m")[0];
button2.click();
},2500);
},2000);
After you figure it out, you can save your code in a js file: my_script.js and use Chrome extension JS Injector to automatically inject it in your page, without needing to use Chrome DEV Tools.

you need to call first button click on click of first button call another method on given timeout
so first time 1 button is clicked after on click of first button call another button method with 500 timeouts will be ok no need to do 2000 or 2500 timeout

Click event not triggering for every iteration of for loop

I want to automate this page to generate exam results. I want to generate exam results from one particular date to some other particular date. On clicking the submit button, the page generates another page in a new tab.
Manually clicking 10 times will generate 10 tabs. But see the following code:
for(let i=0;i<10;i++)
{
document.querySelector('#reg1').click();
console.log(`clicked ${i}th time`)
}
I want to trigger a click 10 times and it should generate 10 tabs accordingly. But the problem is that the click works only works on the 10th iteration and spawns 1 tab only. Help me.
see
Edit:
#Jesse
See my utility full code:
var dateFrom=new Date('2017-01')
var dateTo=new Date('2019-01')
for(var i=dateFrom;i<dateTo;i.setMonth(i.getMonth()+1))
{
// console.log(`${i.getFullYear()}-${i.getMonth()}`);
// var dd=`${i.getFullYear()}-${i.getMonth()}`;
var dd=new Date(i).toISOString().substr(0,7);
console.log(dd);
document.querySelector("input#picker.form-control").value=dd;
var type='Supplementary'
document.querySelector("select#result_type.form-control.form-email.selectoption").value=type;
document.querySelector('#reg1').click();
}

Somehow you have to execute the subsequence clicking in an asynchronous manner. I got this work by this:
let i=0;
(function doClick(){
document.querySelector('#reg1').click();
i++;
if(i<10) setTimeout(() => doClick());
})()
Another approach using async function:
(async function doClick() {
for(let i=0;i<10;i++) {
document.querySelector('#reg1').click();
await new Promise(setTimeout);
}
})()

I just figured out that my browser's popup blocker is stopping the subsequent tabs from being opened.
Try turning off your popup blocker. I was able to trigger the behavior you're after with mine off.
It works when you click it because it's a user interaction, so the blocker assumes it's something you're actively trying to do. If you trigger it programmatically, repeatedly, it gets blocked. This makes sense given that one of your browser's popup blocker's primary functions is to prevent sites from trapping you in infinite popup hell.

It's because you're using the same ID. Either switch to using a class or change the ID names so they aren't identical.

Javascript code to Click a Button on a Webpage for every 5 Minutes

I have a webpage and it has a Refresh Button. I need to click the button every 5 minutes. The Normal Refresh or Reload or F5 doesn't work in this situation. Is there a way that Javascript can do this task.
Like, I will save the javascript as Bookmark and once I click the bookmark. Then, the javascript event has to click the refresh button every 5 minutes.
I googled it and I found the below code. But, it doesn't work. When I click on it, it just showing a random number in a blank page.
javascript:if(window.autoRefreshInterval) { clearInterval(window.autoRefreshInterval); };
window.autoRefreshInterval = setInterval(function() { jQuery(".refresh").click(); },60000)
thank you in advance,

"I have a webpage and it has a Refresh Button. I need to click the
button every 5 minutes. The Normal Refresh or Reload or F5 doesn't
work in this situation. Is there a way that Javascript can do this
task."
It's not very clear to me, but every time you refresh a webpage, javascript is loaded again. So if you have intervals or variables they are reset at each refresh. If you want to keep some value among refreshs you can store values using localStorage or cookies for example.
If you want refresh automatically page you can use setInterval or metatag "refresh".
"Like, I will save the javascript as Bookmark and once I click the
bookmark. Then, the javascript event has to click the refresh button
every 5 minutes."
Look at this: Add a bookmark that is only javascript, not a URL

you can call your refresh code function or button click event in
setTimeout(yourFucntion(),5000);
else
setTimeout($("#btnName").click(),5000);

Try below code:
<!DOCTYPE html>
<html>
<body onload="f1()">
<script language ="javascript" >
var tmp;
function f1() {
tmp = setInterval(() => f2(), 2000); // replace this with 5 min timer
}
function f2() {
document.getElementById("Button1").click();
}
function f3() {
console.log("Hello World");
}
</script>
<button id="Button1" onclick="f3()">click me</button>
<div id="demo"></div>
</body>
</html>

There are two versions for you to try, one uses javascript to click the button the other automates running the function that they have tied to the button.
Non jQuery:
javascript:(function(){if(window.autoRefreshInterval) {clearInterval(window.autoRefreshInterval);}window.autoRefreshInterval = setInterval(function(){document.getElementsByClassName("refresh")[0].addEventListener('click');},60000);})()
Or with jQuery (OP's comment on original thread):
javascript:(function(){if(window.autoRefreshInterval) {clearInterval(window.autoRefreshInterval);}window.autoRefreshInterval = setInterval(function(){$ctrl.refresh();},60000);})()

Delayed post, but hopefully it helps someone :-).
The trick for me was locating the element by css document.querySelector('.pbi-glyph-refresh').click();
You can combine this with the original code like so, it correctly clicks the PowerBI refresh button on a 60 second timer (the var is in ms).
javascript:if(window.autoRefreshInterval) { clearInterval(window.autoRefreshInterval); };
window.autoRefreshInterval = setInterval(function() {document.querySelector('.pbi-glyph-refresh').click(); },60000)

Continuing functions for chrome extensions-javascript

so I am working on a really small chrome extension. There is a webpage and I want to click the buttons on this webpage. After I click all of them I want to click the next page button and keep doing the same thing.
I have no problem finding the buttons or the nextpagebutton. I am also able to do it using setInterval functions but I feel like it is kind of a hacky way to do this.
The below code is what I have so far
function clickButtons(){
var followButtons = $('.buttonClass');
var numberOfButtons = followButtons.length;
for(var i=0; i<numberOfButtons; i++){
followButtons[i].click();
}
setTimeout(nextPage, 500);
}
function nextPage(){
var nextPageBtn = $('.nextPageButtonClass');
nextPageBtn.click();
setTimeout(clickButtons,500);
}
so my question is
1. My for loop to click all the buttons is not working. Is there a better way to click every button class?
2. I need to call the second function after the first one. And when the second one is finished, I need to call the first one again and they must follow each other constantly. I tried setting a timeout and calling the other one ın both functions. But it is not working. How can I do this?
This code basically doesn't do anything. And I have been scratching my head. Sorry I am a huge javascript noob