Aquí estoy frente a un problema extraño. Tengo un botón que, cuando se hace clic, inserta <h1>Hello</h1> en un elemento de destino. Descubrí que el clic solo funciona una vez y no muestra ningún error. No puedo entender por qué no funciona.
Aquí está mi código
const addMore = document.querySelector('#addMore'); let parentElem = document.querySelector('#target'); addMore.addEventListener('click', function() { parentElem.innerHTML += ` <h1>hello</h1> ` }) <div class="col-md-12" id="target"> <div class="row"> <div class="col-md-2 mb-3"> <div class="form-group"> <label for="price" class="form-label small">Price</label> <div class="input-group"> <span class="input-group-text">₹</span> <input type="number" name="price" id="price" class="form-control" placeholder="100"> </div> </div> </div> <div class="col-md-2 mb-3 d-flex align-items-end"> <button type="button" class="btn btn-primary" id="addMore">+ Add More</button> </div> </div> </div>