jQuery chess board

Inspired by the excellent jQuery table striping tutorial by Jack Born and the 8 queens puzzle, I have done a chess board with jQuery, html and css.
The basic logic was this:
Every ODD ROW will start with a white square followed by a black square, then a white square and so on.
Like so:

8

8

Likewise, each EVEN row will start with a black square and alternates with a white square.
Simply put,
ODD ROW + ODD ELEMENT = white
ODD ROW + EVEN ELEMENT = black
EVEN ROW + ODD ELEMENT = white
EVEN ROW + EVEN ELEMENT = black

All this, achieved with a little CSS

.white {
background-color: #FFCE9E;
width: 60px;
height: 60px;
}
.black {
background-color: #D18B47;
width: 60px;
height: 60px;
}

and FOUR LINES of jQuery!

$("#board tr:odd td:odd").addClass("white");
$("#board tr:odd td:even").addClass("black");
$("#board tr:even td:odd").addClass("white");
$("#board tr:even td:even").addClass("black");

Here it is -- my own jQuery chess board:)

	a	b	c	d	e	f	g	h
8									8
7									7
6									6
5									5
4									4
3									3
2									2
1									1
	a	b	c	d	e	f	g	h

jQuery password strength meter

jQuery has been quite impressive right from the word go, even though I did nothing "real world" with it.
I stumbled across a password strength meter done using normal javascript and CSS.
I instantly decided to jQuery it -- without the password rules and in fact, even without the password field!.
All you have to do is enter a "percentage" of how strong the password is and the meter will be displayed.
Since this is of the "Get a percent, display it as a meter" kind, it can be used for stuff OTHER THAN password meters too.. Like a "You have used xx% of your mailbox" or something similar..

Without much ado, here's my attempt and the source code:

Demo -- Enter a number (zero or more) and click Change:

Code:

<script src="jquery-1.2.3.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$("#changemeterpercentbutton").click(function() { //Assign a callback function to the "change" button
var iPercent = $("#meterpercent").val(); //Get the percent value from the textbox
var percent = iPercent + "%"; //Just add a "%" sign to it -- to be used in CSS

iPercent = parseInt(iPercent); //Get the numeric form of the percentage -- for comparisons
if(iPercent > 100) { // Cap the percentage to a max of 100
iPercent = 100;
percent = "100%";
}
$("#meterdescription").html(percent); // Display the percentage (with the % sign) below the meter

// Handle the styles for the meter for different percentage ranges
if(iPercent <= 20) {
$("#meter").css({width: percent, background: "#56e500"});
} else if(iPercent <= 40) {
$("#meter").css({width: percent, background: "#399800"});
} else if(iPercent <= 60) {
$("#meter").css({width: percent, background: "yellow"});
} else if(iPercent <= 80) {
$("#meter").css({width: percent, background: "#ff5f5f"});
} else if(iPercent > 80) {
$("#meter").css({width: percent, background: "#ff0000"});
}
}).click(); //Programatically call the click function on page load so that the percentage meter is displayed on page load (using the default text box value)
});

</script>

<style>

.metercontainer {
width: 150px;
}
#meter {
height: 10px;
}
</style>


<input type="text" name="meterpercent" id="meterpercent" value="40">
<input type="button" name="changemeterpercentbutton" id="changemeterpercentbutton" value="Change">
<br>
<div class="metercontainer">
<div id="meter" class="grey"></div>
<div id="meterdescription"></div>
</div>