To get the options you just have to change the Jquery selector to $("#test>option")
that picks up all the <option>
tags within <select>
test.
However, in your case it is much easier to get the html of the <select>
all and use in the placement within <div>
:
$('#dv').append('<select name=' + algumName + '>' + $("#test").html() + '</select>');
Notice that I also put a% w / o of% missing in% w / o%
Example:
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><selectid="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
This function server to move the DOM tree up and pick up the nearest element that plays with the indicated one. The search starts in the element itself.
In the code you used, +
, would catch the element select name='algumName'
if it is above, but it still did not solve the problem.
Exemplifying a simple use of $(this).closest('#test')
:
$("#p1").closest("h1").css('background-color','red');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><h1><pid="p1">texto p1</p>
</h1>
Here #test
gets the closest
closest to $("#p1").closest("h1")
, which is exactly what is above.
The html can be more complex than the <h1>
tried in the same catch some element, going through all the elements above until reaching the top:
$("#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><pid="p1">texto p1</p>
</h1>
</div>
In this last example we made <p>
to closest
, trying to get the closest
closer to <div>
which is what is two levels above. We were able to see that this was where the color was attributed due to the larger size given to it in this example.