Hello ... I have a button that when clicking the button "add question" "clone" my selectbox that is like "Select Question ...". With each click it adds another one always incrementing id so that it is different. I wanted to do the opposite, like ... by clicking the "cancel" id button, delete the select's one by one. I made the code below but it just leaves hidden a select ...
$(document).ready(function () { $('#cancelar').click(function () { var $('#3').html(''); // Excluindo pelo id $('#3').hide(); }); });
JavaScript and HTML that adds the selectbox
$(document).ready(function () {
var x = 1
$('#addpergunta').click(function () {
var itemCont = $("#itemCont").val();
var novoItem = $("#1").clone();
novoItem.attr("id", itemCont).attr("name", itemCont);
$("#perguntas").append("<br />");
$("#perguntas").append(novoItem);
itemCont++;
$("#itemCont").val(itemCont);
});
});
<input type="hidden" id="itemCont" value="2" />
<div class="col-md-6" id="perguntas">
<select class="form-control" name="1" id="1">
<option value="0">Selecione a Pergunta...</option>
</select>
</div>
<div class="form-group col-md-5">
<div class="col-md-offset-4 col-md-9">
<button type="submit" id="incluir" class="btn btn-default" style="height:35px; width:70px;">Incluir</button>
<button type="button" id="addpergunta" class="btn btn-success" style="height:35px;" title="Adicionar Pergunta">
<span class="glyphicon glyphicon-plus"></span>
</button>
<button type="button" id="cancelar" class="btn btn-danger" style="height:35px;" title="Cancelar">
<span class="glyphicon glyphicon-ban-circle"></span>
</button>
</div>
</div>