Move a child out of parent div and into a new div in Bootstrap? -

say have 2 parent divs (pictures included), possible move child div2 div1 when browser transitions screen size of md xs?

  <div class="col-xs-12 col-md-6">     <h1> 1 </h1>     <h1> 2 </h1>      <!-- 5 goes here -->   </div>   <div class="col-xs-12 col-md-6">     <h1> 3 </h1>     <h1> 4 </h1>     <h1> 5 </h1> <!--- move -->   </div> 

so move h1 text of 5 under h1 text of 2? i'm thinking no because children containe in div elements? pulling won't help

a css solution

if content in div #5 not large , static duplicate content in both containing divs , hide content using responsive utilities hide , show divs @ different breakpoints http://getbootstrap.com/css/#responsive-utilities

javascript solution

look http://api.jquery.com/replacewith/

$( "div.third" ).replacewith( $( ".first" ) );