Q:

Jquery Selectors - Selecting a div that fall before the clicked div

I have dynamically generated code that looks like this: 
<div class="container">
      <div class="item_a">
             TEST
      </div>
      <div class="item_b">
             TEST 2
      </div>

</div>

<div class="trigger_div">
      Click Me
</div>

<div class="container">
      <div class="item_a">
             TEST
      </div>
      <div class="item_b">
             TEST 2
      </div>

</div>

<div class="trigger_div">
      Click Me
</div>

<div class="container">
      <div class="item_a">
             TEST
      </div>
      <div class="item_b">
             TEST 2
      </div>

</div>

<div class="trigger_div">
      Click Me
</div>

This is how I am trying to grab the values using jquery selectors:
$(".trigger_div").on('click', function () {
         var item_a = $(this).closest(".container").children(".item_a");
         var item_b = $(this).closest(".container").children(".item_b");
    });

I am getting undefined values for item_a and item_b. I want to be able to grab the values in the "item_a" and "item_b" fields of the div that comes right before the "trigger_div"

A:

Try this.prev().children
$(".trigger_div").on('click', function () {
    var item_a = $(this).prev().children("item_a");
    var item_b = $(this).prev().children("item_b");
});

