Retrieve and modify the various elements belonging to a specific category

Question

Retrieve and modify the various elements belonging to a specific category

I'm currently developing a chrome extension and I need to access all elements of this specific type: https://i.stack.imgur.com/sDZSI.png

I attempted the following but was unable to modify the CSS properties of these elements:

const nodeList = document.querySelectorAll(".titleCard-progress"); 
for (let i = 0; i < nodeList.length; i++) {   
    nodeList[i].style.visibility = "hidden"; 
}

Is there a way to retrieve all elements that are both of type "progress" and have the class "titleCard-progress"?

javascript css google-chrome google-chrome-extension

Answer 1

Answer №1

It could be possible that your script is running before the elements are generated. Consider the timing of when your code runs in relation to when the elements appear on the page. Even if you run your code after the elements are generated, new elements may continue to be created and your code won't affect them.

To ensure your actions apply to all current and future elements, it might be helpful to add CSS styles that target both existing and upcoming elements.

It's hard to say for certain if this is the root cause of the issue.

Best of luck with resolving it.

Answer 2

It could be possible that your script is running before the elements are generated. Consider the timing of when your code runs in relation to when the elements appear on the page. Even if you run your code after the elements are generated, new elements may continue to be created and your code won't affect them.

To ensure your actions apply to all current and future elements, it might be helpful to add CSS styles that target both existing and upcoming elements.

It's hard to say for certain if this is the root cause of the issue.

Best of luck with resolving it.

Retrieve and modify the various elements belonging to a specific category

Answer №1

Similar questions

Refine current attributes of an object in Typescript

Combining strings using the PHP preg_replace function

What causes useEffect to run twice in React and what is the best way to manage it effectively?

Leveraging Ajax in Django to communicate with the backend and showcase the outcome

Can the `XMLHttpRequest` object stay active when the user switches to a different page?

What methods can be used to modify the behavior of tiptap when pasting plain text?

Tips for ensuring an image fits perfectly within a MUI grid

Transform markdown into HTML code

Utilizing JQuery to detect a combination of ctrlKey and mouse click event

What's the Deal with Angular's Watch Service for Monitoring Data Changes?

Using JavaScript to redirect to a different page while passing parameters

Combining the jquery-UI slider functionality with the canvas rotate() method

Tips for regularly retrieving information from a psql table

Is there a way to set a personalized callback function when closing a modal with MicroModal?

Customize the HTML tags in the Froala text editor with easy insertion and removal

In order to ensure proper alignment, adjust the width of the select element to match the width of the

Internet Explorer is having issues displaying CSS text accurately, particularly in relation to the background-

Is it possible to reference the same PHP file in multiple locations?

Is it possible to set up VS Code's code completion feature to automatically accept punctuation suggestions?

Aligning SVG shapes within each other