javascript - 電子メールと選択オプションの検証、ラベル画像の変更

Question

誰かがこの問題を解決するのを手伝ってくれたらお願いします。ラベルの横にある画像を「星」にする必要があり、メールフィールドが有効な場合は「チェック」画像で変更し、オプションを選択すると同じことが起こります。電子メール フィールドが完成していない場合、または件名が選択されていない場合は、星の付いた画像も同じです。

これは私のhtmlフォームです->

<form id="jform" method="post" action="#" name="jform"  enctype="multipart/form-data">
            <p> 

                    <label for="email"  id="email"  class="w_160 block req_e">E-mail:</label>
                    <input type="text" name="email" id="email" onClick="checkEmail(document.signupform.email.value)" >
            </p>
            <p>     
                    <label for="subject" name="subject" class="w_160 block req">Subject:<!-- <span>* </span> --> </label> 
                    <select name="subject" class="subject" id="subject">
                        <option value="0">select subject</option>
                        <option value="1">subject 1</option>
                        <option value="2">subject 2</option>
                    </select>
            </p>

        </form> 

これはCSSです - >

.req{
    background: url(images/req_star.png) 65px center no-repeat;
    display: block;
}
.req_e{
    background: url(images/req_star.png) 90px center no-repeat;
    display: block;
    padding-left: 35px;
}

.correct{
    background: url(images/valid.png) 65px center no-repeat;
    display: block;
}
.correct_e{
    background: url(images/valid.png) 90px center no-repeat;
    display: block;
    padding-left: 35px;
}

JavaScript ->

$(document).ready(function(){

    var jVal = {

        'email' : function checkEmail() {
                var email = document.getElementById('email');
                var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
                if (!filter.test(email.value)) {
                $('mail').removeClass('correct_e');
                                $('mail').addClass('req_e');
                email.focus;
                return false;
                }
                else{
                        $('mail').removeClass('req_e');
                                            $('mail').addClass('correct_e');
                    }
                }

        'subject' : function() {
        var ele = $('#subject');
        var pos = ele.offset();

        sub.css({
                top: pos.top-10,
                left: pos.left+ele.width()+40
            });

            if(form.subject.selectedIndex > 0) { // an option has been selected 
                sub.removeClass('req').addClass('correct');
                    ele.removeClass('correct').addClass('req');

            } else { // no option selected 
                    jVal.errors = true;
                    sub.removeClass('correct').addClass('req');
                    ele.removeClass('req').addClass('correct');
            }   
    }

    };

// ====================================================== //


    $('#email').change(jVal.email);
    $('#subject').change(jVal.subject);

});