SPFx Application Customizer - hide a <div>

Question

I've written an SPFx Application Customizer which runs fine and I can log to the console with it.

However when I try to hide the "SharePoint" link in the top left of the page in SPO I get the error below:

Error: Failed to create application customizer 'ClientSideExtension.ApplicationCustomizer.ab3da44e-81af-4590-9bf3-b305f602265c'. Error information is 'Cannot set properties of undefined (setting 'display')'.

public onInit(): Promise<void> {
    Log.info(LOG_SOURCE, `Initialized ${strings.Title}`);

    let message: string = this.properties.testMessage;
    if (!message) {
      message = '(No properties were provided.)';
    }

    // Dialog.alert(`Hello from ${strings.Title}:\n\n${message}`).catch(() => {
    //   /* handle error */
    // });

    console.log('DefaultApplicationCustomizerApplicationCustomizer onInit...');

    console.log('get homeLink');
    let homeLink: any = document.getElementsByClassName('o365sx-appName');
    console.log('got homeLink');
    homeLink.style.display = "none"; 
    console.log('changed homeLink');

Answer 1

getElementsByClassName returns a list of elements. You need the first one:

let homeLink: any = document.getElementsByClassName('o365sx-appName')[0];