basicjquery/index.html at master · hacksu/basicjquery · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!DOCTYPE html>
<html>
  <head>
    <title>jQuery</title>

    <!-- This includes the jQuery library into our project. -->
    <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
  </head>
  <body>

    <!-- Animations -->
    <button id="move">Houdini dat square</button>
    <div id="square" style="background-color:yellow;height:200px;width:200px;"></div>

    <!-- Calculator -->
    <input type="text" value="1" id="num1">
    <input type="text" value="3" id="num2">
    <button id="add">Add</button>
    <button id="multiply">Multiply</button>
    <p id="result"></p>

    <!-- Friend List -->
    <h3>My friends!!</h3>
    <ul id="list">
      <li>Robin</li>
    </ul>
    <input type="text" id="newFriend" value="Robin">

    <!-- This includes our own javascript file, where we'll write our jQuery code. -->
    <script src="script.js"></script>
  </body>
</html>