Как выбрать класс идентификатора в jquery

Question

У меня есть два div с разными идентификаторами, но одного класса. Как выбрать класс с заданным идентификатором?

$(function() {
      $('#1').find('.select').click(function() {

        alert("1 clicked ");

      });
      $("#2 .select").click(function() {

        alert("2 clicked ");

      });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="1">
    <button class="select">one</button>
</div>

<div id="2">
    <button class="select">two</button>
</div>

Answer 1

хорошее решение для этой проблемы:

$('#1').find('.select').click(function() { ... });

с этим вы также можете добавить обработчик щелчка для дочерних элементов класса "select".

Answer 2

В вашем первом Div отсутствует тег закрытия Div. Пожалуйста, исправьте это.

Итак: -

<div id="1">
  <button class="select">one</button>
 <div>

Должно быть: -

<div id="1">
  <button class="select">one</button>
</div>

Answer 3

Есть множество способов справиться с такими вещами, но пока вы идете по-своему; вам нужно будет изменить код JS, как показано ниже:

<div id="1">
    <button class="select">one</button>
</div>

<div id="2">
    <button class="select">two</button>
</div>

Код Javascript:

 $(function(){
     $('.select').click(function(){
        var parentElement = $(this).closest('div');
        alert ($(parentElement).attr('id'));

    });
});

Проверьте этот пример работающего кода здесь: https://jsfiddle.net/u2sx44wr/

Answer 4

Отсутствует закрывающий div, и вы можете использовать $ this, для которого нажата кнопка. Нет необходимости обрабатывать событие click дважды.

$(function() {
  $('div').find('.select').click(function() {
    var msg = $(this).html() + "    clicked";
    alert(msg);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="1">
  <button class="select">one</button>
</div>

<div id="2">
  <button class="select">two</button>
</div>