Multiple instances of corner pop up jquery?

Question

I am running a loop that will pick up any news items that should appear in a corner pop up on a website. I have the popup working great for the first item, but the second doesn't show. I've tried to do it by calling the function twice with a different delay & timeout on each one, so they should appear in sequence. I don't really do much jquery/javascript, so I don't understand why that doesn't work. I am guessing it is because the function is the same? Can anyone help me out? Code below!

TIA

<?php $delay = 50;
            $timeout = 3000;
            $i = 1;
    while ( $loop->have_posts() ) : $loop->the_post(); ?>
    <?php if (have_rows('home_page_pop_up')) :
        
        while(have_rows('home_page_pop_up')) : the_row(); 
            if (get_sub_field('show_home') == 'Yes') :
                $showdate = get_sub_field('until_date');
                $today = date('Ymd');
        
        if ( $today <= $showdate ):
        
        ?>
        
        <script>
            
            jQuery.fn.cornerpopup({
            variant: 9,
            //displayOnce: true,
            slide: true,
            timeOut: <?php echo $timeout; ?>,
            delay: <?php echo $delay; ?>,
            link2: "<?php echo site_url(); ?>/news-community/",
            header: "Recent News",
            text2: "<h5><?php the_title(); ?></h5><p><?php the_excerpt(); ?> ... <a href='<?php the_permalink(); ?>'>Read more</a></p>",
            button3: "View all News",
            stickToBottom: true,
            });


        </script>
            <?php endif;
        endif;
        $i++;
    $delay = $delay + 3000;
    $timeout = $timeout + 3000;
        endwhile;
        endif;
        endwhile;
?>