JavaScript loop mixing div

it's my first post in here so big hi to all. I’m new to JavaScript and this is what I’m struggling with. Probably the title of my question is a bit ridicules but what I'm working on is a Google Api feed. The code puts all titles into one div and content into the other. I would like to see them mixed. Please have a look and thank you in advance.

 <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">

    google.load("feeds", "1");

    function initialize() {
      var feed = new google.feeds.Feed("http://encompassme.com/rss/posts/en.xml");
      feed.setNumEntries(2);
      feed.load(function(result) {
        if (!result.error) {


        var containerTitle = document.getElementById("title");
        var containerContent = document.getElementById("content");

          for (var i = 0; i < result.feed.entries.length; i++) {
            var entry = result.feed.entries[i];

            var div = document.createElement("div");
            var diva = document.createElement("div");

            div.appendChild(document.createTextNode(entry.title)); 
            diva.appendChild(document.createTextNode(entry.content)); 


            containerTitle.appendChild(div);
            containerContent.appendChild(diva);

          }

        }
      });
    }
    google.setOnLoadCallback(initialize);

    </script>
  </head>
  <body>
  <div id="entry">
    <div id="title"></div>
    <div id="content"></div> 
   </div> 
  </body>
</html>

What I'm getting:

title
title
content
content

What I want:

title
content
title
content

Solution

Just append both the title and div elements to the same container, like this:

containerContent.appendChild(div);
containerContent.appendChild(diva);

Working example

The problem was that you were appending all titles to a div, and all content to a other div.

What was happening was this:

First, you added title & content 1:

<div> <!-- Fist div here -->
    Title 1
</div>
<div> <!-- Second div -->
    Content 1
</div>

All seems ok, but when you add another article, this is what happened:

<div> <!-- Fist div here -->
    Title 1
    Title 2
</div>
<div> <!-- Second div -->
    Content 1
    Content 2
</div>

And if you just append the elements in one <div>, they will be in there in the order you add them, so resulting in:

<div> <!-- Fist div here -->
    Title 1
    Content 1
    Title 2
    Content 2
</div>