En lugar del control de capas predeterminado del folleto con la casilla de verificación, quiero usar una etiqueta <a> , cuando hago clic en ella, muestra todas las capas asociadas a ese botón.

Tengo ocho <a> con clase y etiqueta, así que si presiono el botón "todos", muestra todos los marcadores, si presiono el botón "casas club" muestra solo los marcadores de las casas club, etc.

Aquí está mi HTML para los botones.

 <div class="buttons"> <div class="buttonsTop"> <a href="" class="all">ALL</a> <a href="" class="clubhouses">CLUBHOUSES</a> <a href="" class="bunkers">BUNKERS</a> <a href="" class="hangars">HANGARS</a> </div> <div class="buttonsBottom"> <a href="" class="facilities">FACILITIES</a> <a href="" class="nightclub">NIGHTCLUBS</a> <a href="" class="arcades">ARCADES</a> <a href="" class="arcades">AUTOSHOPS</a> </div> </div>