Text Modified By InnerHTML Won't Stay Visible

I have a function that is supposed to display a message in a P element if conditions are met. The function runs fine but the text that is sent to 'output1' appears briefly when you

Solution 1:

The reason the innerHTML is not staying visible is because there is some type of onclick method that is resetting the form. If that is true edit your onclick method like so:

onClick="function();return false;"

The change in here is the ;return false;

Solution 2:

You haven't show us how you are calling that function, but the odds are that you are doing so in response to a form's submit button being pressed.

This will modify the DOM, and then submit the form, which will cause a new page to be loaded.

You need to cancel the default behaviour of the form to stop it being submitted.

function logicProcess(evt) {
    // All your other code
    evt.preventDefault();
}
document.getElementById('myForm').addEventListener('submit', logicProcess);