title: Add/remove form element depending on if checkbox is checked
body: <p>I have created a script which creates adds a form element when a check-box is checked. However, when i un check the check-box and then check it again. A new element is created as well as leaving the old one. </p>
  
  <p>I would like, when the check-box is unchecked, the element which was created is removed. When it is checked, the element is added.</p>
  
  <pre><code>// This script checks to see if a tick-box has been ticked
  // If so, displays more form options
  $(function() {
    $('#contactform :checkbox').click(function() {
    var $this = $(this);
    if ($this.is(':checked')) {
  
    var newInput = $('&lt;div class="col-lg-12 col-pad7"&gt;&lt;div class="form-group"&gt;&lt;label class="sr-only" for="name"&gt;Name&lt;br&gt;&lt;/label&gt;&lt;input type="text" name="name" id="name" value="" class="form-control newInput required" placeholder="Name" data-name="Name"&gt;&lt;/div&gt;&lt;/div&gt;');
  
    $('input#checkbox').after(newInput);
  
    } else {
    newInput.remove();
    }
    });
  });
  </code></pre>