more link tweaking

src/site/docs/tutorials/add-elements/index.markdown

 ---
 layout: default
 title: "Add Elements to the DOM"
 description: "You have an Element object, now what?"
 has-permalinks: true
 tutorial:
   id: add-elements
-next: remove-elements
+next: remove-elements/
 next-title: "Remove DOM Elements"
-prev: connect-dart-html
+prev: connect-dart-html/
 prev-title: "Connect Dart & HTML"
 ---
 
 {% capture whats_the_point %}
 
 * In Dart, page elements are of type Element.
 * An Element knows its parent.
 * An Element keeps its children in a List\<Element>.
 * Change the DOM by adding or removing children of elements.
 * Respond to user input with an EventListener.
@@ skipping 25 matching lines @@
 <h3>Dynamically add items to the browser page.</h3>
 </div>
 
 As you learned in the previous target,
 the DOM represents the structure
 of a web page document using a simple tree structure.
 Each node in the tree represents an item on the page.
 Each node in the tree keeps track of both
 its parent and its children.
 In Dart, the
-<a href="http://api.dartlang.org/dart_html/Node.html" target="_blank">Node</a>
+<a href="https://api.dartlang.org/dart_html/Node.html" target="_blank">Node</a>
 class contains the methods and properties
 that implement a node's tree functionality.
 
 HTML page elements are one kind of node that can be in the DOM tree.
 They have a rectangular area on the page and can receive events.
 Examples of elements include
 heading elements, paragraph elements, table elements,
 button elements, and so on.
 
 In Dart,
 elements are implemented by the
-<a href="http://api.dartlang.org/dart_html/Element.html" target="_blank">Element</a>
+<a href="https://api.dartlang.org/dart_html/Element.html" target="_blank">Element</a>
 class, which is a subclass of Node.
 Because the nodes you care about most are usually elements,
 this target focuses on Element,
 rather than on Node.
 
 * [Copy and run the todo app](#copy-app)
 * [About parent and child Elements in Dart](#tree-structure)
 * [Setting up the page in HTML](#html-code)
 * [Getting an element from the DOM](#dart-code)
 * [Registering an event handler](#event-handler)
@@ skipping 10 matching lines @@
 This program dynamically changes the DOM,
 and therefore the web page,
 by adding elements to the DOM tree.
 
 **Try it!** Type in the text field and press return.
 The app adds an item to the list.
 Enter a few items into the input field:
 
 <iframe class="running-app-frame"
         style="height:250px;width:300px;"
-        src="http://dart-lang.github.com/dart-tutorials-samples/web/target03/todo/web/todo.html">
+        src="http://dart-lang.github.io/dart-tutorials-samples/web/target03/todo/web/todo.html">
 </iframe>
 
 You can find the complete source code for this sample on github at
 <a href="https://github.com/dart-lang/dart-tutorials-samples/tree/master/web/target03/todo"
 target="_blank">todo</a>.
 
 This is the beginning of an app to manage a list of things to do.
 Right now, this app is for procrastinators only
 because the program can only add items to your to do list
 but not remove them.
@@ skipping 117 matching lines @@
 is in the top-level variable `toDoList`.
 
 Note the types of these variables: InputElement and UListElement.
 These are both subclasses of Element.
 The dart:html library has dozens of Element subclasses,
 many of which correspond to certain HTML tags.
 This program uses three:
 
 | HTML tag | Dart class |
 |---|---|
-| \<input> | <a href="http://api.dartlang.org/dart_html/InputElement.html" target="_blank">InputElement</a> |
-| \<ul> | <a href="http://api.dartlang.org/dart_html/UListElement.html" target="_blank">UListElement</a> |
-| \<li> | <a href="http://api.dartlang.org/dart_html/LIElement.html" target="_blank">LIElement</a> |
+| \<input> | <a href="https://api.dartlang.org/dart_html/InputElement.html" target="_blank">InputElement</a> |
+| \<ul> | <a href="https://api.dartlang.org/dart_html/UListElement.html" target="_blank">UListElement</a> |
+| \<li> | <a href="https://api.dartlang.org/dart_html/LIElement.html" target="_blank">LIElement</a> |
 {: .table}
 
 ## Registering an event handler {#event-handler}
 
 When a user enters text into the input field,
 a _change_ event fires,
 indicating that the value in the input field has just changed.
 The todo app defines a function, addToDoItem(),
 that can handle these change events.
 The following code connects addToDoItem() to the input field:
 
 ![Add an event handler to the toDoInput element](images/event-handler-todo.png)
 
 Rather than dissect this busy line of code,
 think of it as a Dart idiom
 for adding an event handler to an Element.
 
 ![Dart idiom: Add an event handler to an Element](images/event-handler-idiom.png)
 
 A change event is just one of many different types of events
 that an input element can generate.
 For example, you can use `click` to handle mouse clicks,
 or `keyDown` for when the user presses a key on the keyboard.
 
 ##About EventListener functions {#about-event-listeners}
 
 The argument passed to the listen() method is a _callback function_
 of type 
-<a href="http://api.dartlang.org/dart_html/EventListener.html" target="_blank">EventListener</a>.
+<a href="https://api.dartlang.org/dart_html/EventListener.html" target="_blank">EventListener</a>.
 EventListener is a typedef defined in the dart:html library as follows:
 
 {% prettify dart %}
 typedef void EventListener(Event event)
 {% endprettify %}
 
 As you can see, an EventListener returns no value (void) and takes an
-<a href="http://api.dartlang.org/dart_html/Event.html" target="_blank">Event</a>
+<a href="https://api.dartlang.org/dart_html/Event.html" target="_blank">Event</a>
 object as an argument.
 Any function with this signature is an EventListener.
 Based on its signature, the addToDoItem() function is an EventListener.
 
 {% prettify dart %}
 void addToDoItem(Event e) { ... }
 {% endprettify %}
 
 The Event object passed into an EventListener function
 carries information about the Event that occurred.
@@ skipping 41 matching lines @@
 element with the ID to-do-list, thus styling
 each item in the to do list.
 
 ##Moving elements within the DOM tree {#moving-elements}
 
 Here's an example that shows how to move an element within the DOM.
 **Try it!** Form a word by clicking the letter tiles.
 
 <iframe class="running-app-frame"
         style="height:400px;width:400px;"
-        src="http://dart-lang.github.com/dart-tutorials-samples/web/target03/anagram/web/anagram.html">
+        src="http://dart-lang.github.io/dart-tutorials-samples/web/target03/anagram/web/anagram.html">
 </iframe>
 
 You can find the complete source code for this sample on github at
 <a href="https://github.com/dart-lang/dart-tutorials-samples/tree/master/web/target03/anagram"
 target="_blank">anagram</a>.
 
 When the program starts,
 it creates one button element for each of seven
 randomly selected letters.
 The program adds each button to a DOM element&mdash;a simple
@@ skipping 35 matching lines @@
     You can find more information about the DOM and CSS in
     <a href="/docs/dart-up-and-running/">Dart Up and Running</a>,
     which also provides thorough coverage of the Dart language, 
     libraries, and tools.
   </li>
 </ul>
 
 {% endcapture %}
 
 {% include tutorial.html %}