删除密码颜色改变

*用户名:
*登录密码:
            <span id="pwdLow" class="pwdflag"></span>
            <span id="pwdMid" class="pwdflag"></span>
            <span id="pwdHit" class="pwdflag"></span>
            <span id="pwdinfo"></span>
            <p></p>
            <span class="spanflag">*</span>确认密码:
            <input type="text" name="" id="pwds" placeholder="再次输入您的登录密码">
            <span id="pwdWarning"></span>
            <p></p>
            <input type="submit" name="注册" id="btn">
        </form>
    </div>
</div>
<script>
    //获取文本框和按钮元素
    var username = document.getElementById('username');
    var pwd = document.getElementById('pwd');
    var pwds = document.getElementById('pwds');
    var btn = document.getElementById('btn');
    //获取校验提示
    var usernameWarning = document.getElementById('usernameWarning');
    var pwdWarning = document.getElementById('pwdWarning');
    //获取密码强度标识
    var pwditem = document.getElementsByClassName('pwdflag');

    //用户名失去焦点事件
    username.onblur = function() {
        if (!username.value.trim()) {
            usernameWarning.innerText = '用户名不能为空';
            usernameWarning.style.color = 'red';
        } else {
            checkName();
        }
    };
    //密码失去焦点事件
    pwd.onblur = function() {
        // 如果输入内容的不满足条件时，输入框下面给出提示内容为：6-20位字母或数字，且字体颜色变为红色。
        if (!pwd.value) {
            pwdinfo.innerText = '密码不能为空';
            pwdinfo.style.color = 'red';
            for (var i = 0; i < pwditem.length; i++) {
                pwditem[i].style.backgroundColor = 'gainsboro';
            }
        } else if (pwd.value.length < 6) {
            pwdinfo.innerText = '密码长度不为6';
            pwdinfo.style.color = 'red';
            for (var i = 0; i < pwditem.length; i++) {
                pwditem[i].style.backgroundColor = 'gainsboro';
            }
        } else {
            pwdinfo.innerText = '';

        }
    };
    //键盘按下
    username.onkeypress = function() {
        console.log(username.value);
        console.log('用户名长度' + username.value.length);
    }
    pwd.onkeypress = function() {
        checkPwd();
        console.log(pwd.value);
    };


    //确认密码失去焦点事件
    pwds.onblur = function() {

    };

    //用户名检测
    function checkName() {

        //用户名输入框，正确的条件是：6-30位字母、数字或_， 以字母开头
        // 如果输入内容的不满足条件时，输入框后面的提示内容为。6-30位字母、数字或’_’，字母开头，且字体颜色变为红色。
        //如果输入的满足条件，输入框后面的提示内容为：“用户名输入正确”，且字体颜色变成绿色。
        if (/^[a-zA-Z]{1}\w{5,29}$/.test(username.value)) {
            console.log(username.value);
            usernameWarning.innerText = '用户名输入正确';
            usernameWarning.style.color = 'green';
        } else {
            usernameWarning.innerText = '6-30位字母、数字或’_’，字母开头';
            usernameWarning.style.color = 'red';
        }
    }
    //密码检测
    function checkPwd() {
        //密码输入框，正确的条件是：6-20位字母或数字组成
        //如果输入的密码内容是纯数字、纯小写字母或者纯大写字母，密码强度为低，只有第一块变为红色。
        //如果是两种类型的结合，那么密码强度为一般，第二块变为橘色。
        //如果是三种类型的结合，那么密码强度为高，第三块变为绿色。
        if (/^[A-Za-z0-9]{6,20}$/.test(pwd.value)) {
            if ((/^[a-z]+$/.test(pwd.value)) || (/^[A-Z]+$/.test(pwd.value)) || (/^[0-9]+$/.test(pwd.value))) {
                pwditem[0].style.backgroundColor = 'red';
            } else if ((/^[a-z0-9]+$/.test(pwd.value)) || (/^[A-Z0-9]+$/.test(pwd.value)) || (/^[a-zA-Z]+$/.test(pwd.value))) {
                pwditem[0].style.backgroundColor = 'red';
                pwditem[1].style.backgroundColor = 'orange';
            } else {
                pwditem[0].style.backgroundColor = 'red';
                pwditem[1].style.backgroundColor = 'orange';
                pwditem[2].style.backgroundColor = 'green';
            }
        }
    };
</script>
问题描述：
