Stock.js

const API_KEY = '[Enter API Key Here]';

const alphavantageAPI = 'https://www.alphavantage.co/query?function=GLOBAL_QUOTE&symbol=';

function searchStock() {

    let table = document.querySelector('#output');
    let message = document.querySelector('#message');

    //Clear out table and message
    table.innerHTML = '';
    message.innerHTML = '';
    message.className = '';

    let symbol = document.querySelector('#stockSymbol').value;

    $.getJSON(`${alphavantageAPI}${symbol}&apikey=${API_KEY}`, (data) => {

        let items = [];

        //Table header
        items.push(`<thead class="thead-dark"><th style="text-align:center" colspan="2">Stock Information for ${symbol.toUpperCase()}</th></thead>`);

        //Table Rows
        $.each( data["Global Quote"], ( key, val ) => {
            items.push( `<tr><td>${key.substring(4)}</td><td>${val}</td></tr>` );
        });

        //Message user if no items returned
        if (items.length === 1) {
            items = [];
            message.className = 'alert alert-danger';
            message.innerHTML = 'Stock Symbol Not Found. Try Again.';
        }

        table.innerHTML = items.join('');
        
    });
}