wrapAll() is creating double the divs?

Question

I have a container div with two divs inside of it, like such:

<div class="container">
  <div class="child1"></div>
  <div class="child2"></div>
</div>

I have wrapped another div around 'child1' and 'child2' but it's appearing twice which I haven't been able to fix:

$(".child1, .child2").wrapAll('<div class="style"></div>');

Which is rendering out as the following:

<div class="container">
    <div class="style">
       <div class="style">
          <div class="child1"></div>
          <div class="child2"></div>
       </div>
    </div>
</div>

But what I actually want is the following:

<div class="container">
   <div class="style">
     <div class="child1"></div>
     <div class="child2"></div>
   </div>
</div>

How do I go about fixing this? I have tried numerous other methods of trying to sort the double-append.

EDIT: The issue was jquery was firing twice, I moved the code out of the existing file and into a new file. Once I did this the answers below all worked.

Answer 1

Try:

   $(".container > div").wrapAll('<div class="style"></div>');