How to remove a div without affecting a div equal jquery?

Navigation
2

At the moment of doing click in a button add in jquery this generates a append with 4 inputs and two buttons, a button eliminates the row which works well, but there is another boton that must to be deleted along with a input at the time of doing click , the problem is that this deletes the div I need but in all.

CODE 

$('.agregarDireccion').click(function(e) {
    e.preventDefault();
    $('#direcciones').append('
                    <div class="row">
                      <div class="col-md-2">
                        <div class="form-group">
                          <input type="text" class="form-control" name="direccion[]" placeholder="Dirección Alternativa">
                        </div>
                      </div>
                      <div class="col-md-2">
                        <div class="form-group">
                          <input type="text" class="form-control" name="pais_dir[]" id="pais-dir" placeholder="Pais Actual"> 
                        </div>
                      </div>
                      <div class="concat-dpto">
                        <div class="col-md-2">
                          <div class="form-group">
                          <input type="text" class="form-control dpto-dir" name="dpto_dir[]" placeholder="Departamento">       
                          </div>
                        </div>
                        <div class="col-md-2">
                          <div class="form-group">
                            <button type="button" class="btn btn-danger remove-dpto-dir" style="border-radius= 50px 50px;">X</button> 
                          </div>
                        </div>
                      </div>
                      <div class="col-md-2">
                        <div class="form-group">
                          <input type="text" class="form-control" name="ciu_dir[]" placeholder="Ciudad">
                        </div>
                      </div>
                      <div class="col-md-2">
                        <div class="form-group">
                        <button type="button" class="btn btn-danger remove">Eliminar</button>
                      </div>
                    </div>');
  });

//Este es el que borrar el div que necesito, pero se lo borrar a todos los que cree  
$('#direcciones').on("click",".remove-dpto-dir",function(e) {
    e.preventDefault();
    $('.concat-dpto').remove();
  });

    
asked by JDavid 27.11.2018 в 19:39
source

1 answer

3

You need to specify the context using this like this: 

$('#direcciones').on("click",".remove-dpto-dir",function(e) {
  e.preventDefault();
  $(this).parents('.concat-dpto').remove();
});
    
answered by 27.11.2018 / 19:44
source
Doubt with a MYSQL query Retrieve a hidden value in html