Good afternoon!
I'm trying to change the text of a button whenever it's clicked. (ONCLICK) The problem? Well, apparently all buttons have the same class and I do not have access to HTML, just the js and css of WP .. Is there any way I can add a specific class to make it work?
jquery code
<script>
$(window).on('click', function(){
$('a', '.price')
.text('SELECIONADO');
});
</script>
HTML Coding
<p class="price"><a href="#" class="purchase" title="Selecionar">SELECIONADO</a></p>
Important detail: I forgot that even if I solve this, I still need to complement the code so that when clicking another button, the previous one goes back to "Select" and the new one clicks "Selected".
They all have the same line, the only difference is a hashkkey that comes after the class
<li class="hotel_block hotelContainer selected" hashkey="1214192">
<figure>
<p class="thumb no_image hide"></p>
<img class="thumbImageUrl" src="https://www.travelagent.com.br/uploadImages//6b36d85b-537c-4f87-a563-a51d9e49a593.jpg"></figure><divclass="content">
<h3 class="name">Maria do Mar Hotel |REGIÃO CENTRAL|</h3>
<p class="stars star3">
<span class="rating-foreground">
<meta itemprop="rating" content="3">
</span>
</p>
<div class="hotel_group">
<span class="easter-egg">
Id: 1214192 <br>HotelOffline - 1214192
<br>
</span>
<p class="address">
Rodovia João Paulo, 2285 - João Paulo - 88030-300
</p>
<p class="distance downtown">
6.22 km<small>A 6.22 km do centro da cidade</small>
</p>
<p class="distance airport">
13.32 km<small>A 13.32 km do aeroporto FLN- Hercilio Luz, Brasil (FLN)</small>
</p>
<p class="short-description">
Hotel econômico no bairro João Paulo a poucos quilômetros do Centro, com vista para a Baía Norte, ampla área verde, hidro externa, jardim de inverno, piscina, playground, sala de jogos, quad...
</p>
</div>
<a href="#" class="details show hotel btnhotelDetails" title="Detalhes">Detalhes</a>
<a href="javascript:void(0);" class="observation showObservations btn">Observações</a>
</div>
<div class="details boxhotelDetails masterprice"></div>
<div class="rooms_options">
<div class="room_header hide">
<ul class="tab tabRoomButtons">
<li class="itemBtnTabRoom selected">
<a href="#" class="btnTabRoom" title="Quarto 1">Quarto 1</a>
</li>
</ul>
<p class="help">
<small>Escolha uma opção de quarto para cada um dos quartos que você solicitou na pesquisa</small>
</p>
</div>
<div class="rooms_group">
<div class="room_group show">
<ul class="listRooms rooms">
<li class="roomsgroup_room price price_even selected show" roomhashkey="475601">
<label>
<input type="radio" checked="" name="room-1214192-0" class="select_btn room buy " roomhashkey="475601">
<div>
<p class="name">Standard Single </p>
<p class="services">Cafe da Manha</p>
<a href="#" class="imageRoom more_pics showImagesRoom">SELECIONADO</a>
<p class="price price-exchange" originalcurrency="BRL" displayexchangerate="undefined" originalprice="227">
R$ 227,00
</p>
<p class="priceSufixx">Diária</p>
</div>
</label>
</li>
<li class="roomsgroup_room price price_odd hide" roomhashkey="458842">
<label>
<input type="radio" name="room-1214192-0" class="select_btn room buy selected" roomhashkey="458842">
<div>
<p class="name">Standard Casal</p>
<p class="services">Cafe da Manha</p>
<p class="price price-exchange" originalcurrency="BRL" displayexchangerate="undefined" originalprice="268">
R$ 268,00
</p>
<p class="priceSufixx">Diária</p>
</div>
</label>
</li>
<li class="roomsgroup_room price price_even hide" roomhashkey="475489">
<label>
<input type="radio" name="room-1214192-0" class="select_btn room buy selected" roomhashkey="475489">
<div>
<p class="name">Standard Twin</p>
<p class="services">Cafe da Manha</p>
<a href="#" class="imageRoom more_pics showImagesRoom">SELECIONADO</a>
<p class="price price-exchange" originalcurrency="BRL" displayexchangerate="undefined" originalprice="268">
R$ 268,00
</p>
<p class="priceSufixx">Diária</p>
</div>
</label>
</li>
<li class="roomsgroup_room price price_odd hide" roomhashkey="484741">
<label>
<input type="radio" name="room-1214192-0" class="select_btn room buy selected" roomhashkey="484741">
<div>
<p class="name">Standard Triplo</p>
<p class="services">Cafe da Manha</p>
<a href="#" class="imageRoom more_pics showImagesRoom">SELECIONADO</a>
<p class="price price-exchange" originalcurrency="BRL" displayexchangerate="undefined" originalprice="335">
R$ 335,00
</p>
<p class="priceSufixx">Diária</p>
</div>
</label>
</li>
</ul>
<a href="#" class="open_rooms hotel btnSeeRooms show" title="Mostrar mais quartos">Mostrar mais quartos</a>
<a href="#" class="hide hide_rooms" title="Esconder Quartos">Esconder Quartos</a>
</div>
</div>
<p class="price">
<a href="#" class="purchase" title="Selecionar">SELECIONADO</a>
</p>
</div>
<div class="hotel_map"></div>
<div class="hotelDetailsIFrameContainer iframe"></div>
<div class="hotel_observations"></div>
<div class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-front ui-draggable ui-resizable" tabindex="-1" role="dialog" style="display: none; position: absolute;" aria-describedby="ui-id-19" aria-labelledby="ui-id-20">
<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix ui-draggable-handle">
<span id="ui-id-20" class="ui-dialog-title"> </span>
<button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close" role="button" title="Close">
<span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span>
<span class="ui-button-text">Close</span>
</button>
</div>
<div class="hotel_gallery ui-dialog-content ui-widget-content" id="ui-id-19" style="display: block;"></div>
<div class="ui-resizable-handle ui-resizable-n" style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-w" style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-sw" style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-ne" style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-nw" style="z-index: 90;"></div>
</div>
</li>