Armar matriz

[rodricrzz]

Hola gente.

Estoy realizando un trabajo de JS en el cual tengo que armar una web con carro de compras todo con solo HTML/CSS/JS.
Me estoy rompiendo el coco para poder organizar mi matriz donde se guardaran las películas, pero no logro hacerlo. Necesitaría saber si me pueden ayudar a organizar la matriz, la cual debería contener el titulo de la película, descripción, imagen de portada y precio (al menos eso), para luego poder mostrarlo con el uso del DOM.

También me sería muuuuuy útil que me digan como mostrar las películas (con un for), si el código de cada "box" de película es el siguiente:

Código:

<div class="caja">
            	<div class="box-image"><img src="images/covers/avatar.jpg" /></div>
                <div class="box-titulo"><h3>Avatar</h3></div>
                <div class="box-descripcion">
                	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum viverra viverra elementum. Donec in sodales lectus. Nam eleifend lobortis dolor, at placerat magna congue in. Quisque quis erat orci, a venenatis nisi.</p>
                </div>
                <a class="box-button" href="#">AGREGAR</a>
        	</div>

Cada "caja" se encuentran flotadas una al lado de la otra mediante CSS, y todas se encuentran dentro de un div.

Muchas gracias y espero que puedan ayudarme.