php - How to select multiple objects of a class for css manipulation -

this might simple question or isn't possible. i'm trying use queryselector() function select objects of particular class css manipulation. i've got several objects of different classes , using links in main navigation toggle objects depending on link clicked.

i'm using combination of php , jquery here accomplish this.

this works single object:

the php/html:

<div class="red box">lorum</div> <div class="blue box">ipsum</div> <div class="blue box">ipsum</div> 

my nav php (i've tried simplify i'm doing make things clearer here):

$value = "blue"; echo "<a href=\"#\" onclick=\"document.queryselector('.".$value."').classlist.toggle('hover');\">link</a>"; 

the hover action corresponds css linked earlier in php , simple tile flip.

what ends happening right first object class given, not other objects class. i've tried using queryselectorall() , getelementbyclassname() don't know if i'm doing wrong or i'm trying isn't possible. writing function better way go this?

any suggestions? appreciated. thanks.

add id anchor

echo '<a href="#" id="link_blue">link</a>'; 

then add event handler

$('#link_blue').on('click', function() {     $('.blue').toggleclass('hover'); });