Question

I would like to move an ID that is in an element to the next select element on the page. I have to do this because of software that is used to write the select boxes does not allow classes or ids to be directly applied to select elements. I also want it to be automated so that if I have 20 select boxes I don’t have 20 separate lines of jQuery.

Here is the current code:

<div id="stack" class="moveID">
    <select name="overflow">
        <option value="hi">Hi</option>
    </select>
</div>

Here is what I would like to happen.

<div class="moveID">
    <select name="overflow" id="stack">
        <option value="hi">Hi</option>
    </select>
</div>

Answer 1

As you requested, to automate this for all items with the class moveID, you could use this:

$('.moveID').each(function() {
    var id = this.id;
    $(this).removeAttr('id').children().first().attr('id', id);
});