Como eliminar un elemento de un div

Avatar

Como puedo eliminar un elemento de un div contenedor, además quisiera que me respondieran sin la ayuda de jquery y sin los métodos de evento en las etiquetas ya que recien estoy empezando con javascript.

let contenedor = document.getElementById("contenedor")
let enlace = document.getElementsByClassName(".enlace")

boton.addEventListener("click",() => {

   let li = document.createElement("li")
   li.innerHTML = "Contenido " + Math.random() + "<a class='enlace'>x</a>"

   contenedor.appendChild(li)
})

enlace.addEventListener("click",(e) => {
   e.target.parentNode.parentNode.removeChild(e.target.parentNode); //ACÁ ME SALE ERROR
}) 
body {
   font-size: sans-serif;
   max-width: 400px;
}
#contenedor li {
   padding: 18px;
   margin: 8px 0;
   background: #ddd;
   list-style: none;
}
#contenedor li a {
   cursor: pointer;
   float: right;
   padding: 3px 7px;
   background: #fbfbfb;
}
<!DOCTYPE html>
<html>
 <head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <title>Page Title</title>
     <meta name="viewport" content="width=device-width, initial-scale=1">
 </head>
 <body>

   <h1>Como agregar o eliminar elementos a una div</h1>

   <div id="contenedor">
       <li>Contenido 1<a>x</a></li>
       <li>Contenido 2<a>x</a></li>
   </div>

    <input class="boton" type="button" value="Agregar elemento" style="float: right;">

 </body>
</html>```
Avatar

agregale un style.display= 'none' creo q va asi o .classlist.add('ocultar') o className = ' ocultar'

Necesitas iniciar sesión para responder.
Avatar

Hola, hasta donde tengo entendido en document.getElementsByClassName va el nombre de la clase pero sin punto entonces seria: let enlace = document.getElementsByClassName("enlace")

Necesitas iniciar sesión para responder.
Avatar

const div = getElementById('main')

div.addEventlistener('click', ()=> div.style.display = 'none')

Necesitas iniciar sesión para responder.
Avatar

div.style.display = 'none' // aca le agregas estilos en el html div.classList.add(' ocultar') // aca le agregas una clase q debe existir en tu css div.className = 'ocultar' // hace lo mismo

Necesitas iniciar sesión para responder.
Avatar

Esta línea let enlace = document.getElementsByClassName(".enlace") no te devuelve un elemento sino una lista por eso no le puedes pasar un evento click. Ahí esta el problema.

Necesitas iniciar sesión para responder.
Avatar

En primera creo que no debe ser: document.getElementsByClassName(".enlace")

sino:

document.getElementsByClassName("enlace")

es decir sin el punto de clase, solo el nombre de la clase, ademas esa instruccion te devuelve un array de elementos porque como son clases, muchos elementos pueden tener esa clase, el mismo nombre te lo dice get ELEMENTS, elementos, entonces te regresa un array, aun si solo tienes 1 elemento con esa clase, te regresaria un array con 1 elemento.

Si es para eliminar algo en particular tendrias que usar document.getElementById ese si te regresa 1 unico elemento.

Necesitas iniciar sesión para responder.
Necesitas iniciar sesión para responder.