Adicionar linha em uma table a partir de uma requisição AJAX

[jotaplaysson 0]

Olá, estou estudando um exemplo que não consigo fazer funcionar.

É bem simples:

 

Ao clicar no botão, esperar 5 segundos e inserir uma linha numa tabela. se eu fizer diretamente no javascript, a linha aparece, mas se eu utilizar o ajax, a linha não aparece.

 

meu exemplo:

 

$(function(){			
	$("#botao").click(function(){
		$("#table").last().append("<tr><td>Teste</td></tr>");
		$.ajax({
			method: 'post',
			url: 'script.php',
			async: true,
			complete: function(data){
			    $("#table").last().append(data);
		        }
		});	
		
	});
});

<?php
	// 5 seconds
	sleep(5);
 
	// Response
	echo "<tr><td>Hello</td></tr>";
?>

A linha "Teste" é inserida, porém a linha "Hello" não aparece.

[jotaplaysson 0]

Consegui resolver mudando a notação,

meu script ficou assim:

 

               $(function(){			
			$("#botao").click(function(){
				$("#table").last().append("<tr><td>Teste</td></tr>");
				$.ajax({
					method: 'post',
					url: 'script.php',
					async: true,					
				}).done(function(data){
						$("#table").last().append(data);						
					});
				
			});
		});

Só achei estranho, porque eu já havia testado a notacao dessa forma antes e dava erro... Como se eu estivesse acessando uma variável nula, mas é isso. Deu certo. Obrigado!