JS trigger another element by class after click on a button

Question

If i click on a button, i want to trigger another button selected by class.

I wrote the following HTML:

<button onclick="document.getElementsByClassName("frame-16nsqo4").click()">Click</button>

`document.getElementsByClassName` will return an array,so invoke `click` will not work — flyingfox, Nov 29 '22 at 10:01

score 0 · Answer 1 · answered Nov 29 '22 at 10:02

0

As I wrote in the comment document.getElementsByClassName("frame-16nsqo4") will return an array,thus document.getElementsByClassName("frame-16nsqo4").click() will not work

you need to get the element rather than array

So change

<button onclick="document.getElementsByClassName("frame-16nsqo4").click()">Click</button>

to

<button onclick="document.getElementsByClassName("frame-16nsqo4")[0].click()">Click</button>

answered Nov 29 '22 at 10:02

flyingfox

13,414
3
24
39

Or [`.querySelector()`](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector) which is in theory faster as it doesn't need to search the entire DOM as it can exit early as soon as it finds the first match, unlike `getElementsByClassName` which searches the entire DOM – Nick Parsons Nov 29 '22 at 10:06
@NickParsons Yeah,but OP needs to clarity his question with more details – flyingfox Nov 29 '22 at 10:09

score 0 · Answer 2 · answered Nov 29 '22 at 10:03

Document.getElementsByClassName has the suffix getElements not getElement indicating that it's a collection/array

The getElementsByClassName method of Document interface returns an array-like object of all child elements which have all of the given class name(s).

Use

document.getElementsByClassName("frame-16nsqo4")[0].click()

or better use

document.querySelector(".frame-16nsqo4").click()

JS trigger another element by class after click on a button

2 Answers2