Haber esto deberia funcionar, pero no funciona.
Y me tire hasta las 3 de la noche intentandolo.
Dejo el codigo especifico y luego un enlace de la pagina entera.
Necesito ideas.
<html>
<script type="text/javascript" src="jquery-1.8.2.js"></script>
<script type="text/javascript">
function muestraContenido(url){
$(document).ready(function() {
$.get(url, function(respuestaxml){
$("#boton").click(function(evento){
$('ordenador', respuestaxml).each(function(i){
var tipo = $(this).find("tipo").text();
var marca = $(this).find("marca").text();
var modelo = $(this).find("modelo").text();
var peso = $(this).find("peso").text();
var precio = $(this).find("precio").text();
var imagen = $(this).find("imagen").text()
$("#capaMuestra").css("display", "block");
$("#capaMuestra").html($("#capaMuestra").html() +
"-tipo: " + "<span style = 'color:red'>" +tipo +
"</span>" + "<br>" +
"-marca: " + marca + "<br>" +
"-modelo: " + modelo + "<br>" +
"-peso: " + peso + "<br>" +
"-precio: " + precio + "<br>" +
"-imagen: " + imagen + "<br>" + "<br>");
})
});
});
});
}
</script>
<style type="text/css">
#capaMuestra{
background-color:#fcffc8;
display:none;
font-size:11pt;
margin-top:10px;
padding:10px;
width:400px;
height:295px;
overflow:hidden;
-moz-border-radius-topleft: 4px;
-moz-border-radius-topright:4px;
-moz-border-radius-bottomleft:4px;
-moz-border-radius-bottomright:4px;
-webkit-border-top-left-radius:4px;
-webkit-border-top-right-radius:4px;
-webkit-border-bottom-left-radius:4px;
-webkit-border-bottom-right-radius:4px;
border-top-left-radius:4px;
border-top-right-radius:4px;
border-bottom-left-radius:4px;
border-bottom-right-radius:4px;
}
</style>
<body onload="muestraContenido('Ordenadores en Stock.xml')">
<div id="capaMuestra"></div>
<button align="center" id="boton" type="button" >Mostrar</button>
</body>
</html>
Enlace de la pagina:
https://www.dropbox.com/s/fsvewvi8wi5yfk7/Ordenadores%20en%20Stock.html