<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
    <title>with_js</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="/test.js" type="text/javascript" charset="utf-8"></script>
  </head>
  
  <body id="with_js">
    <h1>FooBar</h1>
    
    <p id="change">This is text</p>
    <div id="drag">
      <p>This is a draggable element.</p>
    </div>
    <div id="drop">
      <p>It should be dropped here.</p>
    </div>
    
    <p><a href="#" id="clickable">Click me</a></p>
    
    <p>
      <select id="waiter">
        <option>Foo</option>
        <option>My Waiting Option</option>
      </select>
    </p>
    
    <p>
      <input type="text" name="with_focus_event" value="" id="with_focus_event"/>
    </p>

    <p>
      <input type="checkbox" id="checkbox_with_event"/>
    </p>

    <p>
      <input type="submit" id="fire_ajax_request" value="Fire Ajax Request"/>
    </p>

    <p>
      <a id="reload-link" href="#">Reload!</a>
      <div id="reload-me"><em>waiting to be reloaded</em></div>
    </p>
  </body>
</html>

