title: Adding content using .append with multiple lines of code
body: <p>I have a form I am creating. This is the code for the form:</p>
  
  <pre><code> &lt;form action="post_2.php" method="post" class="pure-form pure-form-stacked"&gt;
          &lt;fieldset id="DoctorInfo"&gt;
   &lt;legend&gt;&lt;strong&gt;Part Two&lt;/strong&gt; - Doctor Information&lt;/legend&gt;
          &lt;h2&gt;Primary Doctor&lt;/h2&gt;
          &lt;div class="pure-g-r"&gt;
              &lt;div class="pure-u-1-3"&gt;
                  &lt;label for="doctorFirstName"&gt;Doctor First Name&lt;span style="color: red"&gt;*&lt;/span&gt;&lt;/label&gt;
                  &lt;input id="doctorFirstName" name="doctorFirstName" type="text" required&gt;
              &lt;/div&gt;
  
              &lt;div class="pure-u-1-3"&gt;
                  &lt;label for="doctorLastName"&gt;Doctor Last Name&lt;span style="color: red"&gt;*&lt;/span&gt;&lt;/label&gt;
                  &lt;input id="doctorLastName" name="doctorLastName" type="text" required&gt;
              &lt;/div&gt;
  
              &lt;div class="pure-u-1-3"&gt;
                  &lt;label for="establishmentName"&gt;Practice Name&lt;span style="color: red"&gt;*&lt;/span&gt;&lt;/label&gt;
                  &lt;input id="establishmentName" name="establishmentName" type="text" required&gt;
              &lt;/div&gt;
  
              &lt;div class="pure-u-1-3"&gt;
                  &lt;label for="focusOfPractice"&gt;Type of Doctor&lt;span style="color: red"&gt;*&lt;/span&gt;&lt;/label&gt;
                  &lt;input id="focusOfPractice" name="focusOfPractice" type="text" value="Primary Care Giver" readonly&gt;
              &lt;/div&gt;
  
              &lt;div class="pure-u-1-3"&gt;
                  &lt;label for="doctorPhone"&gt;Practice Phone Number&lt;span style="color: red"&gt;*&lt;/span&gt;&lt;/label&gt;
                  &lt;input id="doctorPhone" name="doctorPhone" type="tel" required&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div id="docList"&gt;&lt;/div&gt;
          &lt;/fieldset&gt;
  
  
          &lt;fieldset id="confirm2"&gt;
              &lt;div class="pure-g-r"&gt;  
                  &lt;div class="pure-u-1"&gt;
                  &lt;style scoped&gt;
  
                  .button-next,
                  .button-cancel,
                  .button-back,
                  .button-add{
                      color: white;
                      border-radius: 4px;
                      text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
                  }
  
                  .button-next {
                      background: rgb(28, 184, 65);
                  }
  
                  .button-cancel {
                      background: rgb(202, 60, 60);
                  }
  
                  .button-back {
                      background: rgb(223, 117, 20);
                  }
  
                  .button-add {
                      background: rgb(66, 184, 221);
                  }
  
  
              &lt;/style&gt;
                      &lt;a href="index.html"&gt;&lt;button type="button" class="button-cancel pure-button"&gt;Cancel&lt;/button&gt;&lt;/a&gt;
                      &lt;a&gt;&lt;button type="button" onclick="history.back();" class="button-back pure-button"&gt;Back&lt;/button&gt;&lt;/a&gt;
                      &lt;button type="button" name="add" class="button-add pure-button" id="addDoc"&gt;Add Another&lt;/button&gt;
                      &lt;a href="signup_3.php"&gt;&lt;button type="submit" name="next" class="button-next pure-button"&gt;Next&lt;/button&gt;&lt;/a&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/fieldset&gt;
          &lt;/form&gt;
  </code></pre>
  
  <p>I also am trying to make the form add another set of input fields using the .append() function from jQuery. Formating is in Pure-CSS.</p>
  
  <p><a href="http://jsfiddle.net/mherPresident/6JPBL/1" rel="nofollow">here is the jsfiddle</a></p>
  
  <p>I understand that this may be an error with multiple lines, and if that is the case, then I can move to the second part of my question. What do you typically type in JavaScript to help apostrophes and parenthesis meant to remain as part of the string not to truncate the code. For example:</p>
  
  <pre><code> $(.this).append('&lt;p&gt;Tyler's dog says, "Woof"&lt;/p&gt;');
  </code></pre>
  
  <p>Please keep in mind that I am not a professional programmer in the sense that I know all the jargon and typically obvious things you would expect somebody in CIT to know. </p>