<html>
  <head>
    <meta charset="utf-8">

    <title>Stuff</title>
    <style>
      #hoverable:hover {
        font-style: italic;
      }
    </style>
  </head>
  <body>
    <p>
      Hello {% if name %}to {{ name }}{% else %}world{% endif %}, from &#39;me&#39; &amp; &quot;friends&quot;!
    </p>

    <p class="myclass">Some text in a p with a class</p>

    <p id="hoverable">Hover me!</p>

    <p>It's also allowed to have "quotes" without escaping in text in valid HTML</p>

    <p id="inner-text-test-1">A paragraph with “this” &amp; that 😄</p>
    <p id="inner-text-test-2">Some text with <b>bold</b> and <i>italic</i>.</p>
    <p id="inner-text-test-3"></p>

    <p><a id="self-link-1" href=".">A link to self</a></p>
    <p><a id="self-link-2" href="?param1=val1">Another link to self</a></p>
    <p><a id="self-link-3" href="?param1=val2&amp;param2">Another</a></p>

    <script>
      // The following text shouldn't be treated as a DOM node:
      var html = "<p id='this-is-not-a-dom-node'>Hello</p>";
    </script>
  </body>
</html>
