Problema com html de retorno do jquery ajax

Front-end
#1

Boa noite , tenho um formulário de cadastro de usuários onde é digitado o código do usuario , e se este existir preenche o formulário com os dados deste usuário.A lógica esta pronta e
esta funcionando , porem ele só funciona na primeira vez.Os códigos :

function existe(id) {
	$
	.ajax({
		method : 'get',
		url : "existe/"	+ id,
			dataType : 'html',
			beforeSend : function() {
				$('#carregando').show(100);
			},
			complete : function() {
				$('#carregando').hide(100);
			},
			success : function(retorno) {
				console.log(retorno);
				$('#usrForm').html(retorno);				
			},
			error : function(retorno) {
				console.log(retorno);
				if (retorno.status == 404) {
					$('#usrForm').html(
							'Houve um erro: ' + retorno.status + ' '
							+ retorno.statusText);
				} else {
					$('#usrForm')
					.html(
					'Houve um erro desconhecido entre em contato com o administrador.');
				}
			}
	});
}
<head>
<title>Novo Usuário</title>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/usrNovo.js"></script>

<script type="text/javascript">
	$(document).ready(function() {
		$('#carregando').hide(100);
		$('#id').blur(function() {
			existe($("#id").attr('value'));
		});
		$('#existe').click(function() {
			existe($("#id").attr('value'));

			// 			$('#usrForm').load('existe/2 #usrForm', function() {
			// 				$('pre').text($('#usrForm').html());
			// 			});

		});
		$('#teste').click(function() {
			alert("Código: " + $("#id").attr('value'));
		});

	});
</script>
</head>
<body>
	<form id="usrForm" action="${pageContext.request.contextPath}/usr"
		method="post">
		<div id="formulario">
			<div>
				<span id="carregando">carregando..</span>
			</div>
			<div class="celula">
				<label>Usuário</label> <input type="text" class="integer"
					placeholder="Código do Usuário" name="usr.id" maxlength="4"
					id="id" value="${usr.id}" />
			</div>
			<div class="celula">
				<label>Nome</label> <input class="maiusculo" type="text"
					placeholder="Nome" name="usr.usrnome" maxlength="20"
					value="${usr.usrnome}" />
			</div>
			<div class="celula">
				<label>Senha</label> <input id="senha" class="required"
					type="password" placeholder="Senha" name="usr.usrsenha"
					maxlength="10" value="${usr.usrsenha}" />
			</div>
			<div class="celula">
				<label>Repetição Senha</label> <input id="confirmacao"
					type="password" equalTo="#senha" placeholder="Senha confirmação"
					name="senha2" maxlength="10" value="${senha2}" />
			</div>
			<div class="datausr">
				<label>Usuário Alteração</label> <input type="text"
					class="input-medium" placeholder="Usuário" disabled
					name="usr.usrusr" maxlength="40" value="${usr.usrusr}" />
			</div>
			<div class="datausr">
				<label>Data Alteração</label> <input type="text"
					class="input-medium" placeholder="Dt.Alteração" disabled
					name="usr.usrdtalt"
					value=" <fmt:formatDate pattern="dd/MM/yyyy HH:mm:ss" value="${usr.usrdtalt}" />" />
			</div>
			<!-- 		<br clear="all"> -->
		</div>
		<div class="form-actions">
			<button type="submit" class="btn btn-primary">Salvar</button>
			<!-- 			<button type="button" class="btn btn-primary" id="existe">Existe</button>		 -->
		</div>
	</form>
	<button type="button" class="btn btn-primary" id="existe">Existe</button>
	<button type="button" class="btn btn-primary" id="teste">Teste</button>
	<script type="text/javascript">
		$("#usrForm").validate();
	</script>
</body>

Fiz alguns teste tipo um alert com o valor do campo e antes da requisição ajax ele responde corretamente e depois só responde com undefined.E tambem se eu coloco o botão para chamar o script dentro de ele desaparece depois da requisição.E tambem o evento onblur só funciona na primeira vez!E no retorno no console do firefox ele simplesmente ignora todo o script que chama a função , independente se ela esta em head ou body . Alguem tem alguma ideia que possa me ajudar ?Obrigado !

#2

Ah esse tópico é meu , e não do Anonymous kkkk!

#3