Clicking on an item and having all the classnames changed for all items with the same username

I have a list of chats on html.

Is there a way for me to add a classname to only the item that I clicked along with the items on the list with similar usernames?

<div id="chats">

     <div class="chat">
           <div class="username">Sam</div>
     </div>

    <div class="chat">
           <div class="username">Sam</div>
     </div>

    <div class="chat">
           <div class="username">Sam</div>
     </div>


    <div class="chat">
           <div class="username">Frank</div>
     </div>

<div>

For example, if I clicked the first “Sam” is there a way for me to have all the “Sams” classnames change to “username highlight.” So all the Sam’s would have their class name changed (classname = username sam) except the last one Frank (classname = username).

1 Like

Say you have clicked the element with Sam text and all add sam as a classname to the class attribute. What should happen if the user then clicks Frank?

Why do you care if the user clicks on the name?

What is the ultimate purpose in doing any of this?

Hi @RandellDawson, my apologies, I meant to say when I click on sam, all the one’s that state “Sam” should have a classname of “username highlight.”

Why do I care if the user clicks on the name and What is the ultimate purpose in doing any of this??

I wanted to make all the ones with a text “Sam” get highlighted.

I have a css file that basically adds css to any class with the class name “highlight” in it. I just wanted to see if I click on “Sam” can I make all the other Sam’s classname’s include “highlight” so that all the “Sam’s” have css added to it?

Is the username unique? If so then probably add a class based on the username:

<div class="username user_sam">Sam</div>

And then you can easily target all elements with class user_sam.

Update: Ahh, I see @RandellDawson already suggested this, I didn’t read his reply carefully enough. Sorry about that.

Thank you for taking the time to message me! I was able to figure it out, I appreciate your time!

Thank you, this answered my question and it worked!