Untitled

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
</head>
<body>
	<input type="text" id="input" /> <span id="number"></span> <button id="getTwenty">Get 20</button> <button id="getTen">Get 10</button>

	<script type="text/javascript">
		window.onload = function () {
			var field = document.getElementById('input'),
				numb  = document.getElementById('number'),
				ten   = document.getElementById('getTen'),
				twen  = document.getElementById('getTwenty');

			numb.innerHTML = field.value.length;

			field.onkeyup = function () {
				fire();
			};

			twen.onclick = function () {
				field.value = 'qwertyuiopasdfghjklz';
				fire();
				field.select();
			};

			ten.onclick = function () {
				field.value = 'qwertyuiop';
				fire();
				field.select();
			};

			function fire() {
				numb.innerHTML = field.value.length;
			}
		};
	</script>
</body>
</html>