Jquer Friends Div Change color

The following set of code is the Jquer statement that changes the DIV color after clicking the div or the mouse is placed on the color.

<style type="Text/css">make a div style. a1 {Position:absolute;    width:141px;    height:240px; Z-index:1;    left:6px;    top:33px; border:1px solid #0FF;}.    A2 {Position:absolute;    width:141px;    height:60px; Z-index:1;    left:0px;    top:0px; Background-color: #F0F; border:1px solid #0FF;}.    A3 {Position:absolute;    width:141px;    height:60px; Z-index:1;    left:0px;    top:60px; Background-color: #F0F; border:1px solid #0FF;}.    A4 {position:absolute;    width:141px;    height:60px; Z-index:1;    left:0px;    top:120px; Background-color: #F0F; border:1px solid #0FF;}.    A5 {position:absolute;    width:141px;    height:60px; Z-index:1;    left:0px;    top:180px; Background-color: #F0F; border:1px solid #0FF;}</style>Link Database<?php$db=NewMysqli ("localhost","Root","123","Student"); $sql="SELECT * from Firend"; $result= $dbquery ($sql); $attr= $resultFetch_row (); Echo"<select name= ' name ' id= ' id ' ><option> $attr [1]</option> </Select>";?>put in a 5 div<divclass="A1"><divclass="A2"align="Center"> Zhang San </div><divclass="A3"align="Center"> John Doe </div><divclass="A4"align="Center"> Harry </div><divclass="A5"align="Center"> Zhao Liu </div></div></body>JS Code:<script type="Text/javascript">$ (document). Ready (function (e) {$ (". A2"). MouseOver (function () {$ ( This). CSS ("Background-color","Red") is written with the mouse on it and then the color turns red}) $ (". a3"). MouseOver (function () {$ ( This). CSS ("Background-color","Red")        })        $(". a4"). MouseOver (function () {$ ( This). CSS ("Background-color","Red")        })        $(". a5"). MouseOver (function () {$ ( This). CSS ("Background-color","Red")        })        $(". A2"). Mouseout (function () {if($( This). attr ("XZ")!=1)    {        $( This). CSS ("Background-color","#F0F"writes an effect if XZ is 1, becomes f0f color}}) $ (". a3"). Mouseout (function () {if($( This). attr ("XZ")!=1)    {        $( This). CSS ("Background-color","#F0F")        }        })        $(". a4"). Mouseout (function () {if($( This). attr ("XZ")!=1)    {        $( This). CSS ("Background-color","#F0F")        }        })        $(". a5"). Mouseout (function () {if($( This). attr ("XZ")!=1)    {        $( This). CSS ("Background-color","#F0F")        }        $(". A2"). Click (function () {$ (". A2"). CSS ("Background-color","#F0F"); Write is the mouse click, add a property for XZ, mouse click XZ for 1, the mouse does not click XZ for 0. After clicking the mouse color turns red $ (". A2"). attr ("XZ",0); $( This). CSS ("Background-color","Red"); $( This). attr ("XZ",1)            })        $(". a3"). Click (function () {$ (". a3"). CSS ("Background-color","#F0F"); $(". a3"). attr ("XZ",0); $( This). CSS ("Background-color","Red"); $( This). attr ("XZ",1)            })        $(". a4"). Click (function () {$ (". a4"). CSS ("Background-color","#F0F"); $(". a4"). attr ("XZ",0); $( This). CSS ("Background-color","Red"); $( This). attr ("XZ",1)            })        $(". a5"). Click (function () {$ (". a5"). CSS ("Background-color","#F0F"); $(". a5"). attr ("XZ",0); $( This). CSS ("Background-color","Red"); $( This). attr ("XZ",1)            })        })});</script>

Jquer Friends Div Change color