function sessionPanel(INDEX, idNumber, role, messenger, acknowledgment_signal, offer_signal, accept_offer, reject_offer, chatbox) {
    var mainDIV = document.createElement('div');
    $(mainDIV)
        .attr('id', `infoBox${INDEX}`)
        .attr('class', 'infoBox');

    if(role == 'Tenant') {
        $(mainDIV).append(
            $(document.createElement('ul'))
                .attr('class', 'noStyle')
                .append(`<li><b>Land Owner ${INDEX}<b></li>`)
                .append(`<li><b>ID# ${idNumber}<b></li>`)
        );

        $(mainDIV).append(
            $(document.createElement('h3'))
                .attr('id', `acceptMessage${INDEX}`)
                .attr('class', 'fixedAcceptMessageSize')
                .attr('hidden', true)
        );
    }

    $(mainDIV).append(
        $(document.createElement('div'))
            .attr('id', `offerPanel${INDEX}`)
            .append('<p><b>Offer<b></p>')
            .append($(document.createElement('input'))
                .attr('id', `inputOffer${INDEX}`)
                .attr('type', 'number')
                .attr('onclick', `offerDetails${INDEX}.hidden=true`)
                .attr('oninput', `updateCalculations(this.value, ${INDEX})`)
            )
            .append('<br/>')
            .append($(document.createElement('p'))
                .attr('id', `offerDetails${INDEX}`)
                .attr('hidden', true)
            )
            .append('<br/>')
            .append($(document.createElement('button'))
                .attr('id', `sendOfferTo${INDEX}`)
                .attr('type', 'button')
                .attr('class', 'btn btn-primary btn-sm')
                .attr('onclick', `sendMessage('${offer_signal}', inputOffer${INDEX}.value, '${messenger}')`)
                .html('Make Offer')
            )
    );

    if(role == 'Land Owner') {
        $(mainDIV).append(
            $(document.createElement('div'))
                .attr('id', 'offerAcceptedDiv')
                .attr('hidden', true)
                .append($(document.createElement('h3'))
                    .attr('id', 'offerAcceptedInfo')
                )
                .append($(document.createElement('h5'))
                    .html('Please wait while your tenant negotiates with the other landowners')
                )
        )
    } else {
        $(mainDIV).append('<hr>');
    }

    var currentOfferFrom = role == 'Tenant' ? '<p><b>Current offer from land owner</b></p>' : '<p><b>Current offer from tenant</b></p>';

    $(mainDIV).append(
        $(document.createElement('div'))
            .attr('class', 'fixedAckPanelSize')
            .append($(document.createElement('div'))
                .attr('id', `acknowledgmentPanel${INDEX}`)
                .append(currentOfferFrom)
                .append($(document.createElement('h3'))
                    .attr('id', `currentOffer${INDEX}`)
                    .html('None')
                )
                .append('<br/>')
                .append($(document.createElement('button'))
                    .attr('id', `acceptButton${INDEX}`)
                    .attr('type', 'button')
                    .attr('class', 'btn btn-primary btn-sm largeMargin')
                    .attr('onclick', `sendMessage('${acknowledgment_signal}', '${accept_offer}', '${messenger}')`)
                    .attr('hidden', true)
                    .html('Accept')
                )
                .append($(document.createElement('button'))
                    .attr('id', `rejectButton${INDEX}`)
                    .attr('type', 'button')
                    .attr('class', 'btn btn-primary btn-sm')
                    .attr('onclick', `sendMessage('${acknowledgment_signal}', '${reject_offer}', '${messenger}')`)
                    .attr('hidden', true)
                    .html('Reject')
                )
            )
    );

    if(role == 'Tenant') {
        $(mainDIV).append('<hr>');
    }

    $(mainDIV).append(
        $(document.createElement('div'))
            .attr('class', 'FixedHeightContainer')
            .append($(document.createElement('div'))
                .attr('id', `pastOffersDiv${INDEX}`)
                .attr('class', 'Content')
                .append($(document.createElement('table'))
                    .attr('id', `offersTable${INDEX}`)
                    .attr('align', 'center')
                    .append($(document.createElement('tr'))
                        .append('<th>Offer Number</th>')
                        .append('<th>Offer From</th>')
                        .append('<th>Offer Value</th>')
                        .append('<th>Status of Offer</th>')
                    )
                )
            )
    );

    if(role == 'Land Owner') {
        $(mainDIV)
            .append('<br/>')
            .append($(document.createElement('h4'))
                .attr('id', 'chatboxLabel')
                .addClass('trimmed floatLeft')
                .text('Send message to your tenant in the box below:')
            )
            .append('<div style="float: none; clear:both;" hidden></div>')
    }

    $(mainDIV).append(chatbox);

    return mainDIV;
}