Как правильно сделать функцию click?

Question

[Павел Воронюк]

Намутил вот такой кодик

<div class="layer">
	<div class="recruitment-block">

		<a href="#" id="click">RU</a>

		<div class="recruitment-box ua">
			...
			<button id="signin"> BUTTN 1 </button>	
		</div>

		<div class="recruitment-box ru hidden">
			...
			<button id="signin"> BUTTN 2 </button>
		
	    </div>
    </div>
</div>

$(document).ready(function() { 

		$('.body-recruitment.body-index .wrapper').addClass('hidden');
		$('.body-recruitment.body-index .layer').addClass('display');
		$('.ads').addClass('hidden');

		
		$('#click').click(function() {
			if( $('.recruitment-box.ru').hasClass('hidden') ) {
					
				$('.recruitment-box.ru').removeClass('hidden');
				$('.recruitment-box.ua').addClass('hidden');
				$('#click').text('UA');
					
			} else {
					
				$('.recruitment-box.ru').addClass('hidden');
				$('.recruitment-box.ua').removeClass('hidden');
				$('#click').text('RU');
					
			}
		});

		$('#signin').click(function() {

			$('.body-recruitment.body-index .wrapper').removeClass('hidden');
			$('.body-recruitment.body-index .layer').removeClass('display');
			$('.ads').removeClass('hidden');

		});

	});

примерную работу можно посмотреть тут - xn--80aeirbbdtomneq5kf1nk.xn--j1amh/recruitment/index

jsfiddle.net/v3y44gqy/2

проблема вот в чем:

Если кнопка "Війсккомат" то этот попап убираеться, а если "Военкомат" то кнопка не кликабильна.

Подскажите как проправить скрипт?

Answer 1

[Илья Шатохин]

Атрибут id (который "signin") должен быть уникален в пределах узла DOM (а если строго следовать W3C, то во всем документе). Замените на class "signin", или сделайте два разных id и обработчик повесьте так:

$('#signin-ua, #signin-ru').click(function() {
    $('.body-recruitment.body-index .wrapper').removeClass('hidden');
    $('.body-recruitment.body-index .layer').removeClass('display');
    $('.ads').removeClass('hidden');
});

Answer 2

[Александр Талалаев]

Гм.. как я понял перевод не меняет содержимое блоков, а подставляет другую кнопку, с русским текстом.
А так как id одинаковый, то второй игнорируется, только первый попавшийся. Так что либо делать по классу, либо учитывать разные id, либо для перевода менять содержимое, либо удалять ноду с другим переводом и переписать обработчик события клик с учетом динамическогл контента.