Strong Password Generator - Javascript (Styled for vBulletin)

Code:
{vb:stylevar htmldoctype}
<html xmlns="http://www.w3.org/1999/xhtml" dir="{vb:stylevar textdirection}" lang="{vb:stylevar languagecode}" id="vbulletin_html">
	<head>
		<title>{vb:raw vboptions.bbtitle} - {vb:raw pagetitle}</title>
		<link href="http://d4tabase.com/./cpstyles/global.css" rel="stylesheet" type="text/css"></style>
		{vb:raw headinclude}
		{vb:raw headinclude_bottom}
		<style>
			.pass_textbox
			{
				-moz-border-radius: 3px;
				-webkit-border-radius: 3px;
				border-radius: 3px;
				font: normal 12px Tahoma,Calibri,Verdana,Geneva,sans-serif;
				color: black;
				background: white none;
				border: 1px solid #6B91AB;
				padding: 4px;
				outline: 0;
				text-align: center;
			}
			.pass_btn
			{
				display: inline-block;
				height: 24px;
				padding: 0 7px 0 7px;
				margin-top: 3px;
				font-size: 11px;
				font-weight: bold;
				line-height: 24px;
				color: #333;
				text-align: center;
				text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
				border: solid 1px #999;
				cursor: pointer;
				text-decoration: none;
				-webkit-user-select: none;
				-khtml-user-select: none;
				-moz-user-select: none;
				-ms-user-select: none;
				user-select: none;
				-webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.05),inset 0px 1px 0px 0px white;
				-moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.05),inset 0px 1px 0px 0px #ffffff;
				box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.05),inset 0px 1px 0px 0px white;
				-webkit-border-radius: 3px;
				-moz-border-radius: 3px;
				border-radius: 3px;
				background-color: whiteSmoke;
				background-image: -moz-linear-gradient(top, #FAFAFA, #EDEDED);
				background-image: -ms-linear-gradient(top, #FAFAFA, #EDEDED);
				background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FAFAFA), to(#EDEDED));
				background-image: -webkit-linear-gradient(top, #FAFAFA, #EDEDED);
				background-image: -o-linear-gradient(top, #FAFAFA, #EDEDED);
				background-image: linear-gradient(top, #FAFAFA, #EDEDED);
				background-repeat: repeat-x;
				filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr='#fafafa', endColorstr='#ededed', GradientType=0);
				-webkit-transition: all 0.05s linear;
				-moz-transition: all 0.05s linear;
				-ms-transition: all 0.05s linear;
				-o-transition: all 0.05s linear;
				transition: all 0.05s linear;
			}
			.pass_btn:hover
			{
				background: white;
			}
		</style>
		<script type="text/javascript">
			var charList = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVYXWZ123456789!£$%^&*()-_+={[}]:;@'~#<,>.?/|\¬`\"";
			var genPass = "";
			function createPass(plength)
			{
				genPass = "";
				for(i = 0; i < plength; i++)
					genPass += charList.charAt(Math.floor(Math.random()*charList.length));
				return genPass;
			}

			function getLength()
			{
				var invalid_Chars = "\"!£$%^&*()-_+={[}]:;@'~#<,>.?/|\¬`abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVYXWZ";
				for (var i = 0; i < document.password_generator.pass_length.value.length; i++)
				{
					if(invalid_Chars.indexOf(document.password_generator.pass_length.value.charAt(i)) != -1)
					{
						alert("ERROR: You have entered invalid characters.\nPlease make sure you input ONLY numbers.");
					}
					else
					{
						document.password_generator.pass_output.value = createPass(pass_length.value);
					}
				}
			}
					
			function clearPass()
			{
				document.password_generator.pass_output.value = "";
			}
		</script>
	</head>
	
	<body>
		{vb:raw header}
		{vb:raw navbar}
		
		<div id="pagetitle">
			<h1>{vb:raw pagetitle}</h1>
		</div>
		
		<div class="block" style="width: 400px; margin-left: auto; margin-right: auto;">
			<h2 class="blockhead">Generate a Strong Password!</h2>
			
			<div class="blockbody  formcontrols" style="border: 1px solid black; border-top: none;">
				<div class="blockrow">
					<center>
						<form name="password_generator">
							<span style="color: #333; font-weight: bold; font-size: 11px;">Although you may choose the length of your password, it is recommended that you do not choose a length lower than 15.</span><br/>
							<img src="./images/password_generator/securityseal-blue.png" width="128px" height="128px"></img><br/>
							<span style="color: #333; font-weight: bold;">Your Password:</span><br/>
							<input type="text" class="pass_textbox" name="pass_output" readonly="readonly" style="width: 100%; background: #EDF5FF;">
							<input type="button" class="pass_btn" value="Clear Password" onClick="clearPass();">
							<input type="button" class="pass_btn" value="Generate Password" onClick="getLength();"><br/><br/>
							<span style="color: #333; font-weight: bold;">Password Length:</span><br/>
							<input type="text" class="pass_textbox" id="pass_length" value="15">
						</form>
					</center>
				</div>
			</div>
		</div>
		
		{vb:raw footer}
	</body>
</html>