How to Set Conditional Statement

Hello I’m looking to set a conditional statement on a javascript file so that this style:

<style>
.term-44 header.woocommerce-products-header:not(.active):after {
content: “More..”;
color: #000000;
cursor: pointer;
}
</style>

Only appears on a specific page with H1 = “Porcelain Tiles”
I wrote a javascript file:
<script>

document.addEventListener(‘DOMContentLoaded’, function() {
// Check if the page contains an h1 element with the title “porcelain tiles” var pageTitle = document.querySelector(‘h1’);

if (pageTitle && pageTitle.textContent.trim().toLowerCase() === ‘porcelain tiles’) {
// Create a style element and append it to the head of the document
var style = document.createElement(‘style’);
style.textContent =
.term-44 header.woocommerce-productsheader:not(.active):after {
content: "More..";
color: #000000;
cursor: pointer; } ;
document.head.appendChild(style);
}
});
</script>

In the custom code for the theme doesn’t work.

Note: I’m not using Page ID since when I press the sidebar the styling persist not applicable to other pages that are connected to the sidebar.

Can you guys help edit the code? or make a better one?
I’m using an elementor custom code connected to the woocommerce collection page list

• This topic was modified 2 years, 6 months ago by danieloe918.