EE - 29117604 // Wrap Rows

by ChrisStanyon

HTML

<button id="click">Click</button>

<div id="left-contact-list">
    <div class="col-md-4">One</div>
    <div class="col-md-4">Two</div>
    <div class="col-md-4">Three</div>
    <div class="col-md-4">Four</div>
    <div class="col-md-4">Five</div>
    <div class="col-md-4">Six</div>
    <div class="col-md-4">Seven</div>
</div>

CSS

.row { border: 1px solid red; padding: 0.5rem; }

JavaScript

$('#click').click(function() {

	var divs = $('#left-contact-list').find('div');

    $(divs).each(function() {
        $(this).removeClass('col-md-4').addClass('col w-50');
    });

    for(var i = 0; i < divs.length; i+=2) {
        divs.slice(i, i+2).wrapAll("<div class='row'></div>");
    }

});