I have the following HTML that's generated from a server:

<button id="start-diag-suites" title="add new suite" tabindex="-1" ></button>

How do I click this button with Javascript?

I've tried:

document.getElementById('start-diag-suites').click();

and I've tried the slightly more complex:

  element.dispatchEvent(new MouseEvent(eventName, {
    view: window,
    bubbles: true,
    cancelable: true,
    clientX: coordX,
    clientY: coordY,
    button: 0
  }));
};
var theButton = document.querySelector('#start-diag-suites');
if (theButton) {
var box = theButton.getBoundingClientRect(),
        coordX = box.left   (box.right - box.left) / 2,
        coordY = box.top   (box.bottom - box.top) / 2;
simulateMouseEvent (theButton, 'mousedown', coordX, coordY);
simulateMouseEvent (theButton, 'mouseup', coordX, coordY);
simulateMouseEvent (theButton, 'click', coordX, coordY); }```

but neither seem to work at all

CodePudding user response：

With jQuery:

$('#start-diag-suites').click()

Without jQuery:

const button = document.getElementById('start-diag-suites');
button.dispatchEvent(new Event('click'))