Alt title starting with '#' causes lightgallery to crash in fullscreen

Description The issue involves a crash in the lightgallery library when using an image with an alt title starting with '#12'. The error reported is "querySelector not found." The problem is traced back to the _getSelector function within the library which is used to fetch the title of the image shown in the bottom of the page.

Steps to Reproduce Use an image with an alt title starting with '#12' in the lightgallery library. Trigger the lightgallery functionality. Observe the crash with the error message "querySelector not found."

Issue Analysis The issue is caused by the _getSelector function within the lightgallery library. Specifically, when the alt title starts with '#', the function uses context.querySelector(selector), and this seems to be the source of the problem.

JS code that you use to initialize lightGallery.

let containerEl = document.getElementById('gallery-container') this.myLightGallery = lightGallery(containerEl, { licenseKey: 'xxx', selector: '.gallery-image', speed: 200, plugins: [lgZoom] :, zoom: true, download: false, enableDrag: false, });


### Sample HTML markup

```html
  <div id="gallery-container" class="row ">
                                        @foreach ($ad->media as $media)
                                            <div class="col-thumbnail">
                                                <div class="square-img">
                                                    <a class="gallery-image" href="{{ $media->getUrl('xl') }}"
                                                        id="img-{{ $loop->index }}">
                                                        {{-- Need to have a whitespace in alt otherwise lightgallery might break in titles starting with # --}}
                                                        <img src="{{ $media->getUrl('s') }}" alt=" {{ $ad->title }}" />
                                                    </a>
                                                </div>
                                            </div>
                                        @endforeach
                                    </div>

Environment

Additional context

@johnpsar , When I test the issue, I can't reproduce it. If possible, please provide more information.

window.lightGallery(
            document.getElementById('animated-thumbnails-gallery'),
            {
                selector: '.gallery-item',
                speed: 200,
                plugins: [lgZoom],
                zoom: true,
                download: false,
                enableDrag: false,
            },
        );

<div id="animated-thumbnails-gallery">
        <a
            data-lg-size="1600-1067"
            class="gallery-item"
            data-src="https://images.unsplash.com/photo-1609342122563-a43ac8917a3a?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=1600&q=80"
            data-sub-html="<h4>Photo by - <a href='https://unsplash.com/@tobbes_rd' >Tobias Rademacher </a></h4><p> Location - <a href='https://unsplash.com/s/photos/puezgruppe%2C-wolkenstein-in-gr%C3%B6den%2C-s%C3%BCdtirol%2C-italien'>Puezgruppe, Wolkenstein in Gröden, Südtirol, Italien</a>layers of blue.</p>"
        >
            <img
                alt="#12"
                class="img-responsive"
                src="https://images.unsplash.com/photo-1609342122563-a43ac8917a3a?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=240&q=80"
            />
        </a>
        <a
            data-lg-size="1600-2400"
            data-pinterest-text="Pin it2"
            data-tweet-text="lightGallery slide  2"
            class="gallery-item"
            data-src="https://images.unsplash.com/photo-1608481337062-4093bf3ed404?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=1600&q=80"
            data-sub-html="<h4>Photo by - <a href='https://unsplash.com/@therawhunter' >Massimiliano Morosinotto </a></h4><p> Location - <a href='https://unsplash.com/s/photos/tre-cime-di-lavaredo%2C-italia'>Tre Cime di Lavaredo, Italia</a>This is the Way</p>"
        >
            <img
                alt="#13"
                class="img-responsive"
                src="https://images.unsplash.com/photo-1608481337062-4093bf3ed404?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=240&q=80"
            />
        </a>
 </div>

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

sachinchoolur / lightGallery