title: Dynamically add array contents as new elements - JQuery
body: <p>edit: Problem solved! I was modifying the page before it was loaded so the script didn't actually do anything. I fixed it now and it works. Thanks for the help, I'll have to chalk this one up to being new to jQuery and it's weirdness.</p>
  
  <p>Long story short I'm trying to make a webpage that dynamically takes Article titles, thumbnail images, descriptions, and links to them, and creates a nicely formatted list on the page. I'm trying to accomplish this in jQuery and HTML5.</p>
  
  <p>Here is the sample data that I'll be using to dynamically populate the page. For now formatting isn't important as I can do that later after it works at all.</p>
  
  <pre><code>&lt;script&gt;
  var newsTitles = ["If It Ain&amp;#39;t Broke, Fix It Anyways"];
  var newsPics = ["images/thumbnail_small.png"];
  var newsDescs = ["August 14th 2015&lt;br/&gt;&lt;b&gt;If It Ain't Broke&lt;/b&gt;&lt;br/&gt;Author: Gill Yurick&lt;br/&gt;&lt;br/&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;Sometimes, a solution isn't the only one. So how do we justify changes to systems that don't need to be fixed or changed? I explore various systems from other successful card games and how their approaches to issues (be they successes or failures in the eyes of the deisgners) can help us create EC."];
  var newsLinks = ["it_aint_broke-gill_popson.html"];
  var newsIndex = 0;
  var newsMax = 1;
  </code></pre>
  
  <p>The section of code where I'm trying to use the contents of the arrays above to dynamically fill elements.</p>
  
  <pre><code>&lt;td style="height:500px;width:480px;background-color:#FFF7D7;padding:20px" colspan=2 id="article"&gt;
      &lt;h1&gt;Articles&lt;/h1&gt;
      &lt;!-- the column  for each news peice add an element with the thumbnail, the title and teh desc --&gt;
      &lt;script&gt;
          for(i = 0; i &lt; newsMax; i++) { 
              $("#articleList").append("&lt;h3 href=&amp;quot;" newsLinks[i] + "&amp;quot;&gt;" + newsTitles[i] + "&lt;/h3&gt;", "&lt;img src=&amp;quot;"newsPics[i] + "&amp;quot;&gt;","&lt;p&gt;" + newsDesc[i] + "&lt;/p&gt;", ); $("div").append("hello");
          }
      &lt;/script&gt;
      &lt;div id="articleList"&gt;
          HELLO
      &lt;/div&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>Here is what it ends up looking like, I can post more info if needed as I am aware this may not be clear enough to fully explain my problem but I am unable to determine that. Thank you in advance.</p>
  
  <p><img src="https://i.stack.imgur.com/SIxQM.png" alt="enter image description here"></p>