Question

I have the following code that is automatically generated, I want jQuery code help me to take out the value of every href (the part: “/listing-agent-staff/barack-obama”), and insert this value into a drop down menu.

the auto generated code:

<div class="StaffBlock StaffName">
<a href="/listing-agent-staff/barack-obama">Barack Obama</a>
</div>
<div class="StaffBlock StaffName">
<a href="/listing-agent-staff/bill-clinton">Bill Clinton</a>
</div>
<div class="StaffBlock StaffName">
<a href="/listing-agent-staff/will-smith">Will Smith</a>
</div>

the dropdown menu I want the value to be inserted to:

<label for="CAT_Custom_231994">Listing Contact</label>
<select name="CAT_Custom_231994" id="CAT_Custom_231994" class="cat_dropdown">
<option value="">-- Please select --</option>
<option value="/listing-agent-staff/barack-obama">Barack Obama</option>
<option value="/listing-agent-staff/bill-clinton">Bill Clinton</option>
<option value="/listing-agent-staff/will-smith">Will Smith</option>
</select>

please note the first part is generated automatically so the number of record varies, the number of options in the second part should cope with that.

Answer 1

This should do it:

$(".StaffBlock.StaffName a").each(function() {
    $(".cat_dropdown").append($("<option/>", {
        value: $(this).attr("href"),
        text: $(this).text()
    }));
});​

See DEMO.