I’m working on a web application with a highly customizable interface. I have a decent amount of data in lists, and I wanted to be able to quickly divide that data up into an arbitrary number of columns using Bootstrap markup.
jQuery Function Code
Let’s say we have a number of divs that we want to divide into 2 columns using the bootstrap grid:
All you need to do is use jQuery to select the sibling items, and apply the function:
Resulting document markup:
This code is for a pretty narrow use case. For dividing into columns, it assume all of the sibling elements are about the same height. If there aren’t an even number of elements for each column, the extra elements will be weighted to the left.