<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>title</title>
</head>
<body>
<div id="testZone">
<form>
<table>
<tr>
<td width="20px"><img src="http://webvm.ru/images/isp/control1.jpg" width="20" height="20" alt="Логин" /></td>
<td width="50px"><input style="width: 140px" name="login" type="text" placeholder="Username" /></td>
</tr>
<tr>
<td width="20px"><img src="http://webvm.ru/images/isp/1327308370_te_322299.png" width="20" height="20" alt="Пароль" /></td>
<td width="50px"><input style="width: 140px" name="pass" type="password" placeholder="Password" />
<button tabindex="-1" aria-hidden="true" class="password-reveal" type="button"><img src="http://webvm.ru/images/isp/eye2.png" /></button>
<script>
(function () {
var input = document.querySelector('input[name="pass"]');
document.querySelector(".password-reveal").addEventListener("click", function () {
if (input.getAttribute('type') != 'text') {
input.setAttribute('type', 'text');
} else {
input.setAttribute('type', 'password');
}
});
})();
</script>
</td>
</tr>
</table>
</form>
</div>
</body>
</html>