Как получить первый идентификатор вложенного элемента с Jquery

Question

Это должно точно ответить на мой вопрос:

How to get the first child id inside the div using JQuery

, но когда я пытаюсь это возвращает идентификатор самого родительского элемента. HTML у меня есть:

<div id="top-right-container"> 
    <div class="panel panel-inverse" data-sortable-id="products"> 
     <div class="product-heading"> 
      <h4 class="product-title">Products</h4> 
     </div> 
     <div class="product-body"> 
      <span class="product-text">Product</span> 
      <div> 
       <div id="product-element"></div> 
      </div> 
     </div> 
    </div> 
</div> 

и JS я использую это:

var topRightContainer = $("#top-right-container:first-child").attr("id"); 
var bottomRightContainer = $("#bottom-right-container:first-child").attr("id"); 
console.log(topRightContainer); 

выход на консоли «верхний правый-контейнер»

Answer 1

Это даст вам правильный ответ, который является идентификатором первого дочернего #top-right-container

JSFIDDLE DEMO

var topRightContainer = $("#top-right-container div:first-child").attr("id"); 
alert(topRightContainer);