Modificar el Nº de columnas según condición

[Alexis88]

Creo que se vería más ordenado si se mostrara el nombre de la categoría en una celda y las fotos en otra, en lugar de estar creando una celda para cada imagen, porque, por ejemplo, si la fila 1 tiene 4 imágenes, la fila 2 tiene 2 imágenes y la fila 3 tiene 5 imágenes, se vería un poco anti-estética la diferencia de tamaños por cada fila.

Yo te propongo hacerlo así:

Código Javascript:

var fotos = {"paisaje": ["fotoP1.jpg", "fotoP2.jpg", "fotoP3.jpg"],
             "monumento": ["fotoM1.jpg", "fotoM2.jpg"],
             "deporte": ["fotoD1.jpg", "fotoD2.jpg", "fotoD3.jpg"]
            },
    tabla = document.createElement("table");
 
for (var i in fotos){
    var fila = document.createElement("tr"),
        columna1 = document.createElement("td"),
        columna2 = document.createElement("td");
    
    columna1.innerHTML = i;
    columna1.style.textAlign = "center";  
    columna2.style.textAlign = "center";
  
    for (var j in fotos[i]){
        var img = document.createElement("img");
        img.src = fotos[i][j];
        columna2.appendChild(img);
    }
    fila.appendChild(columna1);
    fila.appendChild(columna2);
    tabla.appendChild(fila);
}
 
tabla.border = 1;
document.body.appendChild(tabla);
 

En un objeto literal, inserto los géneros como propiedades de éste y cada uno de ellos tiene asociado a un array con sus respectivas fotos, que en este caso son nombres de ejemplo pero puedes reemplazarlos por los nombres de las imágenes que deseas mostrar. También creo una tabla.

Con ayuda de un bucle, recorro las propiedades del objeto; en cada iteración, creo una fila y dos columnas, a la primera fila le inserto el nombre de la propiedad que representa al género, además, asigno una alineación del texto al centro de cada columna. Con ayuda de otro bucle, recorro el array relacionado a la propiedad actual; en cada iteración, creo un elemento de imagen y le asigno la imagen equivalente a la iteración actual, luego, inserto en la segunda columna al elemento de imagen con la imagen ya asignada.

Culminado el segundo bucle, adhiero ambas columnas a la fila y ésta a la tabla. Así será en cada iteración hasta formar la tabla. Una vez formada la tabla, le asigno un border para delimitar las celdas y la adhiero al cuerpo del documento.

Así es como se verá: http://jsbin.com/AtUKALO/1

Saludos