How to display multiple html tables in 2 columns

I have an application running on jQuery which fetches some data and creates html tables by appending the newly created tables inside a div element.
The tables are displayed fine, but I would like them to appear next to each other so that the user can see them 2 by 2 and avoid scrolling up and down all the time.

The wanted outcome is:

table1 | table2
table3 | table4
table5 | table6

How can I do that either in html(when constructing the tables) or after with jQuery selectors and filters?

Source: stackoverflow-javascript