querying parse in javascript

Once you have your results, literally start building your content. Say we have this on the HTML side:

<div class="results target"></div>

then we can do this on the JS side:

<script type="text/javascript">
Parse.initialize(...);

new Parse.Query(Post).find({
  success: function(results) {
    buildResultHTML(results);
  }
});

function buildResultHTML(data) {
  var container = document.querySelector("div.results.target");
  data.forEach(function(entry) {
    container.appendChild(buildHTMLRow(entry));
  });
}

function buildHTMLRow(data) {
  // there are a million ways to do this. Usually, you use a templating
  // library to make live easier. Let's roll one:
  var outer = document.createElement("div");
  var img = document.createElement("img");
  var url = data.imagelinkwhatever;
  // safety first: is this a real http:// or https:// link? If not, DON'T USE IT
  img.src = url.indexOf("http") === 0 ? url : "";
  var p = document.createElement("p");
  p.textContent = data.textwhatever; 
  // note: also NEVER use .innerHTML if your data can come from "not you".
  // It's an instant XSS exploit waiting to happen. See below.
  outer.appendChild(img);
  outer.appendChild(p);
  return outer;
}
</script>

But, as the code says: you typically want to use a templating library instead, so you don't have to worry about things like messy JS creation of DOM elements, user content security, etc.

And security is important: if that Parse result can give you something like this:

{
  imgurlwhatever: "javascript:alert('lol')",
  textwhatever: "<script>alert('lol');</script>"
}   

then your page, if it uses blind img.src=... and p.innerHTML=..., will happily execute that JS. That sounds silly, but alert('lol') is a placeholder: if we can get that to run, we can also get things like "call another site's url using an XHR, with the content of document.cookies as url query parameters" and suddenly shit gets real(tm).

ok, I finally figured it out. Here is the code:

  <script>
Parse.initialize("XXXXXXXXXXXXXX");

var Post = Parse.Object.extend("Post");

        function getPosts() {
            var query = new Parse.Query(Post);
            query.find({
                success: function(results){

                    var output = "";
                    for (var i in results) {
                        var title = results[i].get("activityTitle");
                        console.log("ok now");

                        var img = ""
                        var file = results[i].get("Bild");
                        var url = file.url();
                        img = "<img src='"+url+"'>";


                        output += "<div class=\"container\">";
                        output += "<div class=\"row\">";
                        output += "<div class=\"col-md-4\">";
                        output += "<div class=\"post-container\">";
                        output += "<div class=\"post-content no-padding\">";
                        output += img;
                        output += "</div>";
                        output += "<div class=\"post-content\">";
                        output += title;
                        output += "</div";
                        output += "</div>";
                        output += "</div>";
                        output += "</div>";
                        output += "</div>";

                    }
                    $("#list-posts").html(output);
                }, error: function(error) {
                    console.log("Query Error:"+error.message);
                }

            });
        }

        getPosts();

    </script>

And just above the javascript code, in the HTML, I just put:

 <p id="list-posts">
</p>

This gets the objects from parse, and lists them out for me in the format I wanted. thanks for the suggestions though. For anyone else who may need help in the future with something like this, this video (and others by the author) really helped me: https://www.youtube.com/watch?v=_fxh825Bnpg&index=4&list=PLoN_ejT35AEhbFswEKW36LxzyXJs7xCWS