Javascript form submit button not working innerHTML

Question

I am using google maps api. When user moves marker on map submit button will change from disabled. It changes the button from disabled, but I can't submit the form. Nothing happens.

<div class="col-12">
    <form action="submit.php" method="POST" accept-charset="utf-8">
        <input type="text" name="name">
        <div id="submit-btn"><button class="generate-btn" type="submit" disabled>Select Location</button></div>
    </form>
</div>

Here is the listener from google maps.

google.maps.event.addListener(marker2, 'dragend', function (evt) {
    document.getElementById('submit-btn').innerHTML = '<button class="generate-btn" type="submit">Generate</button>';
});

Answer 1

I think instead of changing the inner HTML, you can simply do:

google.maps.event.addListener(marker2, 'dragend', function (evt) {
    document.getElementsByClassName('generate-btn')[0].disabled = false;
});

Answer 2

Instead of:

document.getElementById('submit-btn').innerHTML = '<button class="generate-btn" type="submit">Generate</button>';

Try with setting an ID to your button, like "submit_button", then remove the "disabled" property like this:

document.getElementById('submit_button').disabled = false;