Para obter os options que tem basta apenas alterar o seletor do Jquery para $("#test>option")
que apanha todas as etiquetas <option>
dentro do <select>
test.
No entanto para no seu caso é bem mais fácil apanhar o html do <select>
todo e utilizar na colocação dentro do <div>
:
$('#dv').append('<select name=' + algumName + '>' + $("#test").html() + '</select>');
Repare que também coloquei uns +
que faltavam em select name='algumName'
Exemplo:
let algumName = "nome";
$("button").click(function() {
$('#dv').append('<select name=' + algumName + '>' + $("#test").html() + '</select>');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="test" name "algumName">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<button>Copiar opções</button>
<div id="dv">
</div>
Closest
Esta função server para percorrer a arvore DOM para cima e apanhar o elemento mais próximo que jogue com o indicado. A pesquisa começa no próprio elemento.
No código que utilizou, $(this).closest('#test')
, iria apanhar o elemento #test
caso esse esteja acima, mas continuava a não resolver o problema.
Exemplificando uma utilização simples do closest
:
$("#p1").closest("h1").css('background-color','red');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>
<p id="p1">texto p1</p>
</h1>
Aqui $("#p1").closest("h1")
apanha o <h1>
mais próximo de <p>
, que é o que está exatamente acima.
O html pode ser mais complexo que o closest
tentara na mesma apanhar algum elemento, passando por todos os elementos acima até chegar ao topo:
$("#p1").closest("div").css('background-color','red');
div {
height:150px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<h1>
<p id="p1">texto p1</p>
</h1>
</div>
Neste ultimo exemplo foi feito o closest
para um <div>
, tentando apanhar o <div>
mais próximo de <p>
que é o que está dois níveis acima. Conseguimos ver que foi esse onde foi atribuída a cor devido ao tamanho maior que lhe foi dado neste exemplo.
<options>
dentro do<div>
?append($('<select name='algumName'>"+ options +"</select>'));