<title>My Document</title>
      function change() {
        // document.getElementsByTagName("H1") returns a NodeList of the h1
        // elements in the document, and the first is number 0:
        const header = document.getElementsByTagName("H1").item(0);
        // the firstChild of the header is a Text node:
        header.firstChild.data = "A dynamic document";
        // now the header is "A dynamic document".
        const para = document.getElementsByTagName("P").item(0);
        para.firstChild.data = "This is the first paragraph.";
        // create a new Text node for the second paragraph
        const newText = document.createTextNode(
          "This is the second paragraph.",
        // create a new Element to be the second paragraph
        const newElement = document.createElement("P");
        // put the text in the paragraph
        // and put the paragraph on the end of the document by appending it to
        // the BODY (which is the parent of para)
    <input type="button" value="Change this document." onclick="change()" />