js如何动态清除form表单中input框下的错误信息

form表单

<form action="" method="post" novalidate id="myform">
        {% csrf_token %}
        {% for form in form_obj %}
            <div class="form-group">
                <label for="{{ form.id_for_label }}">{{ form.label }}：</label>
                {{ form }}
                <span style="color: red;float:right" id="error-msg">{{ form.errors.0 }}</span>
            </div>
        {% endfor %}

        <div class="sub">
            <input type="submit" value="登录" class="btn btn-primary">
            <span style="color: red" id="error">{{ error }}</span>
            <a href="{% url 'login_sms' %}">短信登录</a>
        </div>
    </form>

使用js代码动态清除input框下的错误信息

<script>
    $(function () {
        // 点击哪个input框就消除下面的错误信息
	//根据id选择器找到form表单，然后给其绑定一个事件委派，当点击哪个input标签，$(this)就代表该标签，然后在.next（）找到放错误信息的标签，让其文本内容清除
        $('#myform').on('click', 'input', function () {
            $(this).next().text('')
            $('#error').text('')
        })
    })
</script>