title: A bit stuck with the "triangle" program in Javascript
body: <p>I have a bit of an issue at the moment that I am hoping one of you can help me with. I have tried several things, and I just can't get it. I am trying to print a triangle of asterisks using JavaScript. The program is to ask the user for the amount of rows, and then the direction. I haven't even started with the direction yet because I can't get the rows to work. Odd thing is that I can get it to print out the triangle hard-coding the function call. </p>
  
  <p>This is the JS file:</p>
  
  <pre><code>function myTriangle(){
  
  var result = "";
  
  var totalRows = document.getElementById('rows').value;
  var direction = document.getElementById('UpOrDown').value;
  
  for (var i = 1; i &lt;= totalRows; i++){
  
      document.writeln("count");
  for (var j = 1; j &lt;= 1; j++)
      {
             result += "*";
      }
  
      result += "&lt;br/&gt;";
  }
  return result;
  }
  
  var answer = myTriangle();
  document.getElementById('myDiv').innerHTML = answer;
  </code></pre>
  
  <p>This is the HTML file:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;head&gt;
  &lt;title&gt;Lab 2&lt;/title&gt;
  &lt;script src="scripts.js", "div.js"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;form name="myForm"&gt;
      &lt;fieldset&gt;
          &lt;legend&gt;Input Fields&lt;/legend&gt;
      rows:      &lt;input type="text" id="rows" /&gt;&lt;br&gt;
      direction: &lt;input type="text" id="UpOrDown" /&gt;&lt;br&gt;
      press: &lt;input type="button" value="GO!" id="myButton" 
      onclick="myTriangle();"/&gt;
      &lt;/fieldset&gt;
  &lt;/form&gt;
  
  &lt;div id="myDiv"&gt;
  
  &lt;/div&gt;  
  
  &lt;/body&gt;
  </code></pre>
  
  <p>The output will be something like this:</p>
  
  <pre><code>*
  **
  ***
  ****
  *****
  </code></pre>