Parse html list with javascript then output drop down

Question

I am trying to write some javascript that will automatically take text in a html ul list and then output it as a drop down. Here is what I have so far: http://jsfiddle.net/KRWHP/

The problem of course is that the code doesnt go through each list item and output it in its own option tag.

karim79 · Accepted Answer · 2012-01-20 15:11:01Z

3

$("li").each(function () {
    $('<option />').text($(this).text())
                   .val($(this).text())
                   .appendTo("select");    
});

Your fiddle, re-fiddlified.

answered Jan 20, 2012 at 15:11

karim79

343k67 gold badges420 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

karim79 Over a year ago

B CUZ U alrdy optmiz 4 me. KTHXBYE. :)

Raynos · Accepted Answer · 2012-01-20 15:13:08Z

0

Don't need jQuery. Just create a new option node for each element and append that to the select.

var ul = document.getElementsByTagName("ul")[0];
var select = document.getElementsByTagName("select")[0];

[].forEach.call(ul.children, function (el) {
    var option = document.createElement("option");
    option.textContent = el.textContent; 
    select.appendChild(option);
});

Example

answered Jan 20, 2012 at 15:13

Raynos

170k57 gold badges359 silver badges399 bronze badges

Collectives™ on Stack Overflow

Parse html list with javascript then output drop down

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related