Caching code snippets

when a page is cached, the page is saved as a static html file so PHP does not work. you need to handle it using Ajax.

Do you think this can handle it ? Or i must got outside from PHP ?
I am beginner in coding.

// Get the current day and time
add_action('woocommerce_before_add_to_cart_button','open_time');
function open_time(){
	
	?>
	<script>
		// Get current date and time
		let currentDate = new Date();

		// Get current day and time
		let currentDay = currentDate.getDay();
		//let currentTime = currentDate.getHours() + ":" + currentDate.getMinutes() + ":" + currentDate.getSeconds();
		let currentTime = "20:01:00";
		console.log(currentTime);
		
		// Set the opening hours for each day
		let openingHours = {
			1: { 'open': '11:00:00', 'close': '22:00:00' }, // Monday
			2: { 'open': '11:00:00', 'close': '22:00:00' }, // Tuesday
			3: { 'open': '11:00:00', 'close': '22:00:00' }, // Wednesday
			4: { 'open': '11:00:00', 'close': '22:00:00' }, // Thursday
			5: { 'open': '11:00:00', 'close': '22:00:00' }, // Friday
			6: { 'open': '13:00:00', 'close': '22:00:00' }, // Saturday
			0: { 'open': '13:00:00', 'close': '21:00:00' }  // Sunday
		};

		// Get the add to cart button and the message container by their classes
		let addToCartButtons = document.getElementsByClassName("e-atc-qty-button-holder");
		let goToCartButtons = document.getElementsByClassName("go_to_cart");
		let messageContainer = document.getElementById("message_container");
		
		// Check if restaurant is open
		if (openingHours[currentDay] && currentTime >= openingHours[currentDay]['open'] && currentTime <= openingHours[currentDay]['close']) {
			// restaurant is open, so do nothing
			console.log("The restaurant is open.");
		} else {
			// restaurant is closed
			console.log("The restaurant is closed.");

			// Hide the add to cart buttons
			for(let i = 0; i < addToCartButtons.length; i++) {
				addToCartButtons[i].style.display = "none";
			}

			// Hide the go to cart buttons
			for(let i = 0; i < goToCartButtons.length; i++) {
				goToCartButtons[i].style.display = "none";
			}

			// Create a new paragraph element with the closed message
			let closedMessage = document.createElement("p");
			closedMessage.className = "opening_hours_message"; // add class for styling
			closedMessage.textContent = "Grange je práve zatvoreny. Objednajte si cez otváracie hodiny prosím.";

			// Append the message to the body of the document
			document.getElementById("OpenMessage").appendChild(closedMessage); 
		}

	</script>
	<div id="OpenMessage" style="text-align:center"></div>
	<?php

}

You need to make Ajax request. And the Ajax request executes a PHP code. You cannot execute a PHP code directly because pages are saved as a static html file.

If you read something about Ajax, you will understand what I said.