Tip Calculator in pure JS
Review

For what it does that is very dense code. Consider reducing variable name length.

Major points


Direct element reference reduces code size, improves performance, and forces you to ensure element IDs and names are unique.
Adding content via innerHTML, clobbers events, forces reflows, and chews power.
Incorrect currency handling. Money comes in cents, not fractions of a cent. Always use integer math for calculations that involve cash exchanges.


Minor points


Avoid adding event listeners directly to the element's on property. Use addEventListener
There are some cases where innerHTML can be useful, most of the time it is the worst way to add to the DON. Don't use it! 
Add text content via element.textContent.
Don't change element style properties directly, create CSS rules and set the appropriate class name.
Use const for constants.
Don't add comments that point out the obvious.
Use arrow functions for anon functions;


Direct element reference

All elements that have an Id property set can be accessed by that id directly in the global namespace.

&lt;div id="divEl"&gt;Foo&lt;/div&gt;
&lt;script&gt;
    const element = document.getElementById("divEl");
    // is the same as
    const element = divEl;

    ...


This works on all browsers (and has done since netscape died). You MUST ensure that id's are unique, if not your page can not be validated and will enter quirks mode. Browser behaviour will differ if in quirks mode.

Using direct referencing forces you to ensure id's are unique and thus avoid a very common cause of quirky DOM modes. It also greatly reduces the overhead of needing to use DOM queries to locate elements. 

Direct referenced elements are live.

Working with money

When working with currencies you need to remember that money is exchanged in integer units. For the US that is cents. Your calculations do not handle the tip correctly. eg bill = $1000, tip 10%, for 3, means each person must pay $33.33333...

Always work in cents, always round to cent, or round up if there is an exchange priority. In this case you convert the bill to cents, calculate the tip per person, rounding up to nearest cent then convert back to dollars.

bill *= 100;                        // convert to cents
bill = Math.round(bill);            // round to nearest
tip = bill / 100 * tip / people;    // get tip in cents per person
tip = Math.ceil(tip);               // round up
total = bill + tip * people;        // Get total in cents         


When displaying currency always use Number.toLocaleString. Eg displaying the above values.

tipPerPersonDisplay = (tip / 100).toLocaleString("en-US", {style: "currency", currency: "USD"});
totalBillDisplay = (total / 100).toLocaleString("en-US", {style: "currency", currency: "USD"});


Example

Note that element ids have been prepended with El as I do not know what other code or markup you have.

The code size has be reduce by half meaning its is easier to maintain and read.

Money is handled correctly and rounded up to favour the tip (a cent per person max)

const CURRENCY = ["en-US", {style: "currency", currency: "USD"}];
const setElClass = (el, cName, show = true) =&gt; el.classList[show ? "add" : "remove"](cName);

numberOfPeopleEl.addEventListener("input", () =&gt; {
    numberOfPeopleLabelEl.textContent = numberOfPeopleEl.value &gt; 1 ? "people" : "lone wolf";
});

calculateButtonEl.addEventListener('click', () =&gt; {
    var tip = serviceQualityEl.value;
    const bill = billAmountEl.value;
    const people = numberOfPeopleEl.value;

    setElClass(billAmountAlertEl, "alert--show", isNaN(bill));
    setElClass(tipPercentageAlertEl, "alert--show", isNaN(tip)); 

    if (!isNaN(bill) &amp;&amp; !isNaN(tip)) {
        tip = Math.ceil(Math.round(bill * 100) / 100 * tip / people);  // in cents per person
        tipAmountEl.textContent = (tip / 100).toLocaleString(...CURRENCY);
        setElClass(eachEl, "people-count--show", people &gt; 1);
        tipAmountContainerEl.classList.add("tip-amounts--show");
        cashRegisterSoundEl.volume = 0.05;
        cashRegisterSoundEl.play();
    }
});


You will also need the following CSS rules.

.alert--show { display : inline }
.people-count--show { display : inline }
.tip-amounts--show { display : block }