jquery focus and blur not working

I cannot seems to find an answer why jquery is not working. please see codes.

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" language="javascript">
   <style type="text/css">
.holder {
   border-top-style: none;
   border-right-style: none;
   border-bottom-style: none;
   border-left-style: none;
}
body,td,th {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 12px;
}

input{
    background:#FFFFEE;
}
.red{
    background-color:red;
}
</style>
$('input:text').bind('focus blur', function() {
$(this).toggleClass('red');
});
</script>
</head>

HTML

<form id="form1" name="form1" method="post" action="">
<p> </p>
<table width="829" border="1" align="center" class="holder">
<tr>
<td width="889"><p> </p>
<table width="759" height="291" border="0" align="center">
<tr>
<td colspan="7">Pawnshop </td>
</tr>
<tr>
<td colspan="7" bgcolor="#009900"><div align="center">Pawn Reference</div></td>
</tr>
<tr>
<td colspan="2" rowspan="6"><div align="center"><img src="../images/ticket-1-icon.png" width="64" height="64" /></div></td>
<td width="144" height="26"><label for="textfield17"></label>
Serial No.:</td>
<td width="144"> </td>
<td width="146">Pawn Ticket:</td>
<td width="40"> </td>
<td width="69"> </td>
</tr>
<tr>
<td height="23"><input type="text" name="textfield" id="textfield17" /></td>
<td> </td>
<td><input type="text" name="textfield2" id="textfield18" /></td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Date loan granted</td>
<td> </td>
<td>Maturity Date:</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><input type="text" name="textfield3" id="textfield19" /></td>
<td> </td>
<td><input type="text" name="textfield4" id="textfield20" /></td>
<td> </td>
<td> </td>
</tr>
<tr>
<td height="23"> </td>
<td> </td>
<td>Expiry Date of Redemption</td>
<td> </td>
<td><label for="textfield20"></label></td>
</tr>
<tr>
<td height="26"> </td>
<td> </td>
<td><input type="text" name="textfield5" id="textfield21" /></td>
<td> </td>
<td><label for="textfield21"></label></td>
</tr>
<tr>
<td colspan="7" bgcolor="#009900"><div align="center">Client Information</div></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><label for="select2"></label></td>
<td> </td>
<td> </td>
<td colspan="2" rowspan="7"><label for="textfield26"><img src="../images/user-group-icon.png" width="128" height="128" /></label></td>
</tr>
<tr>
<td> </td>
<td>Salutation</td>
<td>Surname</td>
<td>Firstname</td>
<td>Middle Name</td>
</tr>
<tr>
<td> </td>
<td><div align="right">
<select name="select" id="select2">
<option>Select</option>
<option value="Mr">Mr</option>
<option value="Ms">Ms</option>
<option value="Mrs">Mrs</option>
</select>
</div></td>
<td><label for="textfield22"></label>
<input type="text" name="textfield6" id="textfield22"/></td>
<td><label for="textfield23"></label>
<input type="text" name="textfield7" id="textfield23" /></td>
<td><label for="textfield24"></label>
<input type="text" name="textfield8" id="textfield24" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td colspan="3">Complete Address</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td colspan="3"><label for="textfield25"></label>
<input type="text" name="textfield9" id="textfield25" size="69" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td>Contact No.</td>
<td>ID Presented</td>
<td>Email Address</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td><input type="text" name="textfield14" id="textfield26" /></td>
<td><label for="textfield27"></label>
<input type="text" name="textfield15" id="textfield27" /></td>
<td><label for="textfield28"></label>
<input type="text" name="textfield16" id="textfield28" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td colspan="7" bgcolor="#009900"><div align="center">Pawn Item Information</div></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td>Description of the Pawn</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td colspan="3"><textarea name="textarea" id="textarea2" cols="40" rows="5" ></textarea></td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td>Principal</td>
<td><label for="textfield29"></label>
<input type="text" name="textfield10" id="textfield29" placeholder="0.00" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td>Interest</td>
<td><label for="textfield30"></label>
<input type="text" name="textfield11" id="textfield30" placeholder="0.00" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td>Service Charge</td>
<td><label for="textfield31"></label>
<input type="text" name="textfield12" id="textfield31" placeholder="0.00" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td>Net Proceeds</td>
<td><label for="textfield32"></label>
<input type="text" name="textfield13" id="textfield32" placeholder="0.00" /></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td><input type="submit" name="button" id="button" value="Continue >>>" /></td>
<td> </td>
<td> </td>
</tr>
</table>
<p> </p>
<p> </p>
<p> </p></td>
</tr>
</table>
<p> </p>
</form>

please help. thanks

Topic Participants
godfirst090488
jakecigar

jquery focus and blur not working

jquery focus and blur not working

Topic Participants

godfirst090488

jakecigar