Using thymeleafs field.errors in script tags javascript

I currently have a function that sets h6 to a success message when the form is submitted. However, the form field (name) can have errors, as shown by the div with fields.errors. Currently the message will show whenever the form is submitted regardless if there are errors

I want to make it so the function first checks if there are errors, then if there’s none it sets the success message. But to do this, I need access to the ${#fields.errors('name')} in the script tag, and I’m not sure how to do this

 <form id="forgot-password-form" th:action="@{forgot-password}" method="post" th:object="${forgotPasswordForm}" onsubmit="return myFunction()">

        <script>

            function myFunction() {
                document.getElementById("reset-info").innerHTML = "Success";
                return false;
            }
        </script>

        <h6 id="reset-info"></h6>

        <div class="input-box">
            <input type="name" class="form-control" id="name" placeholder="" th:field="*{name}"
                   data-cy="name" autofocus>
            <label for="name"> name<span class="required">*</span></label>
        </div>
        <div th:each="err : ${#fields.errors('name')}" th:text="${err}" class="error-message"></div>

        <div class="submit-button">
            <button type="submit" formnovalidate>Submit</button>

       

    </form>