0

En mi archivo html tengo un botón y un div vació, con javascript quiero que apretando el botón, me añada dentro del div, un elemento 'p' con el texto "Hola Mundo!"

He probado con document.createElement("p"); pero nose como añadir el texto..

¿Como seria el Javascript?

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
</head>
<body>
    <input type="button" value="Click en el texto" onClick="insertarTexto()">
    <div id="contenido"></div>
</body>
</html>
2
  • ¿Qué has intentado? Commented el 27 nov. 2018 a las 16:55
  • 1
    Es muy sencillo utilizando JQuery, inténtalo, cuando te sientas atorado nos muestras lo que intentaste y con gusto te ayudamos. Commented el 27 nov. 2018 a las 16:59

2 respuestas 2

2

Intenta algo así:

let boton = document.querySelector('#boton');
boton.addEventListener('click', ()=>{
  let contenedor = document.querySelector('#contenido');
  let p = document.createElement('p');
  p.innerText = 'Hola, soy un p';
  contenedor.appendChild(p);
});
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
</head>
<body>
    <input type="button" value="Click en el texto" id="boton">
    <div id="contenido"></div>
</body>
</html>

0

Te dejo el código con JQuery, es bastante sencillo utilizando la función append:

$('#btnAdd').on('click', function(){
  $('#contenido').append('<p>Hola Mundo!</p>');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
</head>
<body>
    <input id="btnAdd" type="button" value="Click en el texto">
    <div id="contenido"></div>
</body>
</html>

Te dejo un link con la documentación: http://api.jquery.com/append/. Espero te ayude. Saludos.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.