reorder html inside multiple divs (jQuery)

Question

I'm using jQuery to make modifications to an otherwise-uneditable page. The page contains several container elements in this format:

<div class="container">
    <div class="A"></div>
    <div class="B">
        <div class="C"></div>
    </div>
    <div class="D"></div>
</div>

For each container, I want to move the content so that A is inside of B, like this:

<div class="container">
    <div class="B">
        <div class="C"></div>
        <div class="A"></div>
    </div>
    <div class="D"></div>
</div>

What's the best way to do this with jQuery? Every solution I can think of would only work for a single container element, as opposed to modifying them all.

Answer 1

$('.container').each(function(){
    $(this).find('.A').appendTo($(this).find('.B'));
});