Changing background color dynamically with jquery

Question

Right now there is a part of my page that has a list of objects. When you hover over them, the background turns a light yellow color and return to white when you mouseout. I wan

Answer 1

Finally found my answer to this.

CSS

.highlightedClass{
    background-color: #AEAF93;
}

JAVASCRIPT

                //if condition      
                        if($td_ID.text() === schedule.content().idInFirstColumn){
                                $2nd_tr.addClass("highlightedClass");                       
                        }else{
                            if($2nd_tr.hasClass("highlightedClass")){
                                $2nd_tr.removeClass("highlightedClass");
                            }
                        }

                        $('#viewResultsButton').on('click', function(){
                            if($td_ID.text() === schedule.content().idInFirstColumn){
                                $2nd_tr.addClass("highlightedClass");   
                            }else{
                                if($2nd_tr.hasClass("highlightedClass")){
                                    $2nd_tr.removeClass("highlightedClass");
                                }
                            }
                        });


                //else condition
                        if($td_ID.text() === schedule.content().idInFirstColumn){
                                $tr.addClass("highlightedClass");                       
                        }else{

                            if($tr.hasClass("highlightedClass")){
                                $tr.removeClass("highlightedClass");
                            }
                        }




    //outside of huge if/else/for loop mess.

    $('#viewResultsButton').on('click', function(){
        var flag= false;
        $('#alteratePlan > tbody  > tr').each(function() {
            $td_ID = $(this).find('.td_id');
            if($td_ID.text() === ''){
                if(flag === true){
                    $(this).addClass("highlightedClass");
                    flag= true;
                }
            }else{
                if($td_ID.text() === schedule.content().idInFirstColumn){
                    if($(this).hasClass("highlightedClass")){
                        flag= true;
                    }else{
                        $(this).addClass("highlightedClass");
                        flag= true;
                    }
                }else{
                    flag= false;
                    if($(this).hasClass("highlightedClass")){
                        $(this).removeClass("highlightedClass");

                    }
                }
            }

        });
    });