Want a reusable template for your next project? Feel free to use the HTML and JavaScript below as a starting point.

function post(api_url, data, success_callback, fail_callback) {

    method: 'POST',
    url: api_url,
    data: JSON.stringify(data),
    dataType: 'json',
    contentType: 'application/json',
    success: function(response) {
    error: function(response) {

function submit_email_to_waitlist(){
    // fetch values from the frontend
    var new_signup = document.getElementById('waitlist_email').value; //fetch user signing up on frontend
    var current_url = document.URL; //fetch current URL, including potential referral token

    const success_callback = function(response) {
        // fetching responses
        waiter_email = response['registered_email']
        waiter_priority = response['current_priority']
        total_waiters_currently = response['total_waiters_currently']
        referral_link = response['referral_link']

        // hiding parts of HTML

        // showing parts of HTML

        // appending HTML information
        $('#referral_link_url').html('Your referral link is:' + referral_link)
        $('#info_ref_link').html('Click on the button to copy your referral link (also sent to your email).')

    const fail_callback = function(response) {

        // perform actions based on error codes
        response_code = response['status']
        if (response_code == 422) {
            $('#error_message').html("Invalid value to sign up with.");
        } else if (response_code == 400) {

        {email: new_signup,
            api_key: 'YOUR API KEY',
            referral_link: current_url
        }, success_callback, fail_callback);

<div class="col form-group">

  <h5 class="h5 pt-1" id="current_text" >You are currently in spot</h5>
  <h5 class="h5 pt-1" id="current_waiter_spot"></h5>
  <h5 class="h5 pt-1" id="out_of">of</h5>
  <h5 class="h5 pt-1" id="all_waiter_spots"></h5>

  <label class="cform-label" for="rf-email" id="email_address_text"> Email address </label>
  <input class="cform-control" type="email" id="waitlist_email" placeholder="Your email" >
  <button class="btn btn-primary btn-block" type="button" id="demo_submit_button" onclick="submit_email_to_waitlist()" > Try the demo </button>

  <p class="font-size-ms text-muted" id="referral_link_url"></p>
  <button class="btn btn-primary btn-block" type="button" id="demo_referral" > Copy referral link </button>

  <p class="font-size-ms text-muted" id="filler"></p>
  <p class="font-size-ms text-muted" id="info_ref_link"></p>
  <p class="font-size-ms text-muted" id="error_message"></p>

You are currently in spot