javascript - How to move every 4 elements to another container with jQuery? -


so have markup:

<section class="oldcontainer">   <article></article>   <article></article>   <article></article>   <article></article>   <article></article>   <article></article> </section> <section class="newcontainer"></section> <section class="newcontainer"></section> 

and i'd move <article>'s oldcontainer newcontainer, newcontainer can have no more 4 <article>'s each. how can done jquery? know how wrap elements in situation, not move them :)

if newcontainer elements present then, move them

var $as = $('.oldcontainer article');  $('.newcontainer').each(function(i) {    $(this).append($as.slice(i * 4, (i + 1) * 4))  });
.oldcontainer {    min-height: 5px;    border: 1px solid red;    margin-bottom: 5px;  }  .newcontainer {    min-height: 5px;    border: 1px solid green;    margin-bottom: 5px;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <section class="oldcontainer">    <article>1</article>    <article>2</article>    <article>3</article>    <article>4</article>    <article>5</article>    <article>6</article>  </section>  <section class="newcontainer"></section>  <section class="newcontainer"></section>


Comments

Popular posts from this blog

Android : Making Listview full screen -

javascript - Parse JSON from the body of the POST -

javascript - Chrome Extension: Interacting with iframe embedded within popup -