title: How can I display certain text from a javascript inside the html?
body: <p>I'm just starting to learn javascript, so I don't know how everything works. I have this function:</p>
  
  <pre><code>&lt;div id="box1"&gt;
    &lt;a id="link1"&gt;Link&lt;/a&gt;
    &lt;div&gt;&lt;script&gt;
     function script() {
  
  var producto,cantidad,precio,tp,imagen;
  
  producto=prompt("Ingresar producto:");
  cantidad=parseInt(prompt("Ingresar cantidad:"));
  
  switch (producto) {
    case "disco":
      precio=200;imagen="disco.jpg";break;
    case "micro":
      precio=800;imagen="micro.jpg";break;
    case "placa":
      precio=500;imagen="placa.jpg";break;
    case "memoria":
      precio=800;imagen="memoria.jpg";break;
    case "case":
      precio=100;imagen="case.jpg";break;
    case "tarjeta":
      precio=300;imagen="tarjeta.jpg";break;
    default:
      alert("No se encuentra el producto en lista");
  }
  tp=precio*cantidad;
  
  document.write( "Producto: "+producto+"&lt;br&gt;");
  document.write("Precio: "+precio+"&lt;br&gt;");
  document.write("Cantidad: "+cantidad+"&lt;br&gt;");
  document.write("&lt;br&gt;");
  document.write("Total a pagar: "+tp+"&lt;br&gt;");
  document.write("&lt;img src="+imagen+"&gt;");
  };
  document.getElementById('link1').onclick = function () {
  script();
  };
  &lt;/script&gt;&lt;/div&gt;
  </code></pre>
  
  <p>When I click the "link1" the result appears in a blank page, how can I display the info inside the same page? </p>