I have a Node / Express / EJS backend with the usual HTML / CSS . Javascript front end.

I obviously manage the page rendering from the backend through APIs but I have a Use Case where a front end page (User Settings) has a button on it to Reset the User password. Standard HTML on the page with:

<input class="submit__button" type="button" value="Submit Changes">

and then at the bottom of the HTML Page Im calling the JS file as you would:

<script src="/js/usrSettings.js"></script>

and in the .js file, Im trying to render an ejs template from the backend which has all the logic to reset a password by doing so:

// Redirect to the Reset Password Page when button clicked
const pwdChange = document.getElementById('submit_pwdChange');

pwdChange.addEventListener('click', function () {
    const pwdReset = ejs.render('pwdReset', { layout: './layouts/noLayout', title: 'Apotheosis - Reset Password' });
});

This doesnt work, Im not getting any error msgs either in the front end console Log, nor in the back end but it just doesnt do anything, doesnt render a page, doesnt crash, nothing.

I was wondering how one would go about calling an EJS template from the front end javascript to redirect to that html page?

Any suggestions greatly appreciated.

Cheers, M.