Find all class names containing a word, and then edit them using JavaScript-CodePudding

I want to execute JavaScript that finds all elements on a page that contains some text in it's class name and change the class names.

For example, let's say I have the following elements:

<div >...</div>
<div >...</div>
<div >...</div>
<div >...</div>

Let's say I want to find all the elements that contain the word "selector" in their class names and change the class names of that element to "picker", so that I finally have:

<div >...</div>
<div >...</div>
<div >...</div>
<div >...</div>

What JavaScript can I execute on the page to get this result?

CodePudding user response：

You can use Substring matching attribute selectors and change the class name of elements.

document.querySelectorAll('div[class*="selector"]').forEach(node=> node.className = "picker");