title: Change content of div to many text fields using javascript
body: <p>I want to change the content of div through javascript, but not just to one paragraph.suppose if I have three to four paragraphs,the text field should keep changing,with effect. I have written this code,but it changes only one paragraph.Its not changing again.It would also be good if it were depicted like the letter falls and content is in next letter.Please help</p>
  
  <pre><code>&lt;!doctype html&gt;
    &lt;html&gt;
      &lt;head&gt;
        &lt;meta charset="utf-8"&gt;
        &lt;title&gt;Untitled Document&lt;/title&gt;
      &lt;/head&gt;
  
      &lt;script&gt;
        function myFunction() {
          document.getElementById("paraone").innerHTML="&lt;marquee behavior='scroll' direction='left'&gt;Hello World!&lt;/marquee&gt;";
        }
      &lt;/script&gt;
  
      &lt;style&gt;
        body {
          background: linear-gradient(#ccc, #fff);
          font: 14px sans-serif;
          padding: 20px;
        }
        .letter {
          background: #fff;
          box-shadow: 0 0 10px rgba(0,0,0,0.3);
          margin: 26px auto 0;
          max-width: 550px;
          min-height: 300px;
          padding: 24px;
          position: relative;
          width:100%;
        }
        .letter:before, .letter:after {
          content: "";
          height: 98%;
          position: absolute;
          width: 100%;
          z-index: -1;
        }
        .letter:before {
          background: #fafafa;
          box-shadow: 0 0 8px rgba(0,0,0,0.2);
          left: -5px;
          top: 4px;
          transform: rotate(-2.5deg);
        }
        .letter:after {
          background: #f6f6f6;
          box-shadow: 0 0 3px rgba(0,0,0,0.2);
          right: -3px;
          top: 1px;
          transform: rotate(1.4deg);
        }
      &lt;/style&gt;
      &lt;body&gt;
  
        &lt;button type="button" onClick="myFunction()"&gt;Click&lt;/button&gt;
        &lt;div class="letter"&gt;
  
          &lt;p&gt;Dear Friends,&lt;/p&gt;
          &lt;p id="paraone"&gt;Lorem ipsum dolor sit amet, consectetur adipiscing     elit. Praesent euismod porta tempor. Donec pulvinar turpis nec velit pellentesque quis rhoncus sapien facilisis. Mauris quis massa dui,onvallis est pretium.&lt;/p&gt;
       &lt;/div&gt;
  
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>