JSFiddle - React, Tailwind, and code Playground

by pjnovas

HTML

<div id="contenedor">
  <label for="unaCaja">soy un label</label>
  <input id="unaCaja" type="text" value="soy un input text">
  <span id="unSpan">soy un span</span>
  <input id="unBoton" type="button" value="cliqueame!">
</div>
<div id="resultadoTexto"></div>   
<div id="resultadoHTML"></div>

CSS

#contenedor * {
  display: block;    
  margin: 20px;
  padding: 2px;
}

div {
  border-top: dashed 1px silver;
  border-bottom: dashed 1px silver;
  padding: 20px;
}

JavaScript

$("#unBoton").click(function() {
    var resultado = "Resultado: ";
  
    resultado += "<br/> <b>etiqueta de unaCaja:</b> " + $("label[for=unaCaja]").text();
    resultado += "<br/> <b>unaCaja:</b> " + $("#unaCaja").val();
    resultado += "<br/> <b>unSpan:</b> " + $("#unSpan").text();
    resultado += "<br/> <b>unBoton:</b> " + $("#unBoton").val();
    
    $("#resultadoTexto").text(resultado);
    $("#resultadoHTML").html(resultado);
});