// When the drop-down is selected, display the response
    $('#menu').change( () => {
        let meal = $('#menu').val(); // 'Breakfast', 'Lunch', or 'Dinner'
        let index = 0; // breakfast
        if( meal === 'Lunch' ) {
            index = 1;
        }
        if( meal === 'Dinner') {
            index = 2;
        }
        ReactDOM.render(<Quiz6Component currentMenu={meals[index]} />,
            document.getElementById("food"));
    }); // end select()
} // end onLoad

render() {
    return <div>
    <h3 className="text-primary">{this.props.currentMenu.desc}</h3>
        <img src={"./images/"+this.props.currentMenu.photo+".jpg"} height="100" width="100" />
        <ul className='list-group'>
            {this.props.currentMenu.items.map((item, index) =>
                <li key={index} className='list-group-item' >
                    {item.desc}
                </li>
            )
            }
    </ul>
    </div>
} // end render()