James Allen ring hider

james-allen-ring-hider.js

// ==UserScript==
// @name         James Allen ring hider
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Provides a button for each ring to hide it, should you be in a position of narrowing it down. Refreshing the page undoes the hiding.
// @author       You
// @match        https://www.jamesallen.com/engagement-rings/solitaire/14k-rose-gold-2mm-comfort-fit-solitaire-engagement-ring-item-41238
// @icon         https://www.google.com/s2/favicons?domain=jamesallen.com
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    
    const rings = document.getElementsByClassName('item--1Q-0x');

    rings.forEach(item => {
        const button = document.createElement('button');
        button.innerHTML = 'Hide ring';
        button.style.backgroundColor = 'red';
        button.style.color = 'white';
        button.style.fontSize = '24px';
        button.style.position = 'absolute';
        button.style.top = 0;
        button.style.zIndex = 9999;
        button.addEventListener('click', event => {
            event.target.parentElement.style.display = 'none';
        });

        item.appendChild(button);
    });
})();