Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Reddit Api</title>
  <script
  src="https://code.jquery.com/jquery-3.2.1.min.js"
  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
  crossorigin="anonymous"></script>
</head>
<body>
  <h1>GDI Reddit</h1>
  <div id="reddit_posts"></div>
<script>
  function onLoad(json) {
    console.log("I'm here!")
    var posts = json.data.children;
    console.log(posts);
    var redditDiv = document.getElementById('reddit_posts');
    posts.forEach(function(post) {
      var postDiv = document.createElement('div');
      postDiv.innerHTML = "<h3>" + post.data.title + "</h3><p>" + post.data.selftext + "</p><p><i>" + post.data.author + "</i></p>";
      redditDiv.appendChild(postDiv);
    })
  }
​
  function fetchJSON(query) {
    var script = document.createElement('script');
    script.src = 'https://www.reddit.com/search.json?q='
      + query + '&jsonp=onLoad';
    document.getElementsByTagName('body')[0].appendChild(script);
  }
​
  fetchJSON('girldevelopit');
</script>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
hyendlerpro
0viewers