Your code is just overwriting the same container innerHTML every time through the loop. It sounds like you’re expecting that it would add new text or elements each time.

If you want to add new text, try appending to container.innerHTML instead of overwriting it each time:

container.innerHTML += movie.title + " is a great movie"

Notice += instead of =. This probably also isn’t going to render the way you expect, but you should at least see all the movie titles jammed together in a single element.

Since you’re using a database listener that’s going to get invoked every time something in the collection changes, you should also consider wiping out what’s in that container instead of blindly appending to it each time:

movies.onSnashot( snap => {
  container.innerHTML = ""
  for(const movie of snap.docs) {
    const id = movie.id;
    const data = movie.data();
    container.innerHTML += movie.title + " is a great movie"
  }
})

I’m trying to retrieve data from Firebase and add it in a div’s innerHTML, but I only get the last collection (The Matrix) However, when I do console.log I get all of the collections. Can somebody help?

script: 

const db = firebase.firestore();
const movies = db.collection("movies");

movies.add({
 title: "Jurassic Park",
 Director: "Steven Spielberg"

movies.add({
 title: "The Matrix",
 Director: "The W. brothers"

const container = document.getElementById("container");

movies.onSnashot( snap => {
 for(const movie of snap.docs) {
 const id = movie.id;
 const data = movie.data();

 Console.log(movie.title);
 container.innerHTML = movie.title + " is a great movie"

HTML: 

<div id="container"></div>