Inserting elements

This is paragraph 1.

This is paragraph 2.

This is paragraph 3.

This is paragraph 4.


The jQuery Code START
    
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
      function inserter() {
        $("#target").before("<p>This is paragraph 1.5</p>");
        $("#target").after("<p>This is paragraph 2.5</p>");
      }
    </script>
    
    <style type="text/css">
        .code { color: red; }
        .back { background-color: yellow; }
    </style>
  </head>

  <body>
    <h1>Inserting elements</h1>
    <p>This is paragraph 1.</p>
    <p id="target">This is paragraph 2.</p>
    <p id="source">This is paragraph 3.</p>
    <p>This is paragraph 4.</p>
    <br>
    <form>
    <input type = "button" value="Insert new paragraphs" onclick="inserter()"></input>
    </form>