title: Javascript in an HTML file
body: <p>I'm modifying an html file, and I need a hand with it. It the head there is a bunch of javascript which creates some buttons, and all the buttons get labelled id="#content".</p>
  
  <p>Then in the body, it simply lays out all the buttons in a column with <code>&lt;div id="content" align:"center"&gt;&lt;/div&gt;</code></p>
  
  <p>I want to be able to move the buttons around independently, ie put them in a table. How can I do this?</p>
  
  <p>the code:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
  &lt;html&gt;
  &lt;head&gt;
          &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
          &lt;meta name="viewport" content = "height = device-height, width = 420, user-scalable = no" /&gt;
          &lt;title&gt;Direct Current GUI&lt;/title&gt;
          &lt;script type="text/javascript" src="/webiopi.js"&gt;&lt;/script&gt;
          &lt;script type="text/javascript"&gt;
          webiopi().ready(function() {
                  var content, button;
                  content = $("#content");
  
                  // create a "FORWARDS" labeled button for GPIO 7
                  button = webiopi().createGPIOButton(7, "FORWARDS");
                  content.append(button); // append button to content div
  
                  // create a "REVERSE" labeled button for GPIO 8
                  button = webiopi().createGPIOButton(8, "REVERSE");
                  content.append(button); // append button to content div                                      
          });
  
          &lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
          &lt;table&gt;
                  &lt;tbody&gt;
                          &lt;tr&gt;&lt;td id="content"&gt;&lt;/td&gt;&lt;/tr&gt;
  
                  &lt;/tbody&gt;
          &lt;/table&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>