Skip to main content

2nd header inbetween teasers

https://npfpd.specialdistrict.org/members

You have to be specific about what page the script goes to and then what teaser the header comes after

document.addEventListener('DOMContentLoaded', function() {
    if (window.location.pathname === '/members') { 

        function insertFirefightersHeading(zachReynoldsTeaser) {
            var newHeading = document.createElement('h2');
            newHeading.textContent = 'Firefighters';

            // Styling for clean spacing
            newHeading.style.cssText = `
                display: block;               /* Forces it onto its own line */
                width: 100%;                  /* Full-width to match other headings */
                text-align: left;           /* Center the heading */
                margin: 40px 0 20px;          /* Space above and below */
                margin-left: 15px;
                padding: 0;
                font-size: 28px;
                line-height: 1.4;
                font-weight: 600;
                clear: both;                  /* Ensures no floating elements interfere */
            `;

            // Insert the heading after Zach Reynolds
            zachReynoldsTeaser.parentNode.insertBefore(newHeading, zachReynoldsTeaser.nextSibling);
            console.log("Inserted 'Firefighters' heading.");
        }

        var zachReynoldsTeaser = Array.from(document.querySelectorAll('.teaser, .poc-instance, article'))
            .find(el => el.textContent.includes('Zach Reynolds'));

        if (zachReynoldsTeaser) {
            insertFirefightersHeading(zachReynoldsTeaser);
        } else {
            setTimeout(function() {
                var retryTeaser = Array.from(document.querySelectorAll('.teaser, .poc-instance, article'))
                    .find(el => el.textContent.includes('Zach Reynolds'));
                if (retryTeaser) {
                    insertFirefightersHeading(retryTeaser);
                }
            }, 1000);
        }
    }
});