Loads of bad DOM.

baddom.js

// There's this…

      $(function() {
        $('#add-entry').attr('id', 'add-member').click(function() {
        
          $('#edit').remove();
          $(this).after(
            $('<input>', {
              type: 'submit',
              name: 'add',
              value: 'Done'
            })
          );
          
          $('article table').before(
            $('<ul>').append(
              $('<li>').append(
                $('<label>', {
                  for: 'add-member-name',
                  html: 'name'
                })
              ).append(
                $('<input>', {
                  type: 'text',
                  name: 'add-member-name',
                  id: 'add-member-name'
                })
              )
            ).append(
              $('<li>').append(
                $('<label>', {
                  for: 'add-member-date',
                  html: 'Date'
                })
              ).append(
                $('<input>', {
                  type: 'date',
                  name: 'add-member-date',
                  id: 'add-member-date',
                  placeholder: 'YYYY-MM-DD'
                })
              )
            ).append(
              $('<li>').append(
                $('<label>', {
                  for: 'add-member-email',
                  html: 'Email Address'
                })
              ).append(
                $('<input>', {
                  type: 'email',
                  name: 'add-member-email',
                  id: 'add-member-email'
                })
              )
            ).append(
              $('<li>').append(
                $('<label>', {
                  for: 'add-member-mobile',
                  html: 'Mobile Phone'
                })
              ).append(
                $('<input>', {
                  type: 'tel',
                  name: 'add-member-mobile',
                  id: 'add-member-mobile'                  
                })
              )
            ).append(
              $('<li>').append(
                $('<label>', {
                  for: 'add-member-remarks',
                  html: 'Remarks'
                })
              ).append(
                $('<textarea>', {
                  name: 'add-member-remarks',
                  id: 'add-member-remarks'
                })
              )
            )
          );
        
        });
      });

// Or this…

    $('article table').before(
  // A rather low-tech approach to DOM.
     '<ul>'
      +'<li>'
        +'<label for="add-player-name">Name</label>'
        +'<input type="text" name="add_player_name" id="add-player-name">'
      +'</li>'
      +'<li>'
        +'<label for="add-player-date">Entry Date</label>'
        +'<input type="date" name="add_player_date" id="add-player-date" placeholder="YYYY-MM-DD">'
      +'</li>'
      +'<li>'
        +'<input type="checkbox" name="add_player_member" id="add-player-member" value="1">'
        +'<label for="add-player-member">Member</label>'
      +'</li>'
      +'<li>'
        +'<label for="add-player-email">Email Address</label>'
        +'<input type="email" name="add_player_email" id="add-player-email">'
      +'</li>'
      +'<li>'
        +'<label for="add-player-mobile">Mobile Phone</label>'
        +'<input type="tel" name="add_player_mobile" id="add-player-mobile">'
      +'</li>'
      +'<li>'
        +'<label for="add-player-remarks">Remarks</label>'
        +'<textarea name="add_player_remarks" id="add-player-remarks"></textarea>'
      +'</li>'
      +'<li>'
        +'<label for="add-player-event">Event</label>'
        + select
      +'</li>'
    +'</ul>'
   );