Com esse código abaixo quando clico no botão mat
ele me trás os dados em uma table. Gostaria que ao clicar no botão sp
substitua o conteúdo da tabela por outro.
Código:
<button id="mat" class="button"></button>
<button id="sp"></button>
<table id="matriz">
</table>
<table id="saopaulo">
</table>
<script>
$(document).ready(function(){
$("#matriz").hide();
$("#mat").click(function(){
if($("#matriz").is(":visible")){
$("#matriz").hide();
} else{
$("#matriz").show();
}
$.ajax({
url: "../Conteudo/Matriz.html",
cache: false,
dataType: 'html'
})
.done(function(retorno) {
$("#matriz").html(retorno);
})
.fail(function() {
alert("Algo está errado");
});
});
$("#saopaulo").hide();
$("#sp").click(function(){
if($("#saopaulo").is(":visible")){
$("#saopaulo").hide();
} else{
$("#saopaulo").show();
}
$.ajax({
url: "../Conteudo/saopaulo.html",
cache: false,
dataType: 'html'
})
.done(function(retorno) {
$("#saopaulo").html(retorno);
})
.fail(function() {
alert("Algo está errado");
});
});
});
</script>
.html()
na sua página, para fazer isso mais de uma vez, tem que usar o evento.delegate()