title: get id from a nested div using jquery
body: <p>I don't know how to put this. This has got a bit messy. I couldn't use the right words to ask the question. Here is my code:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="addfieldcontainerdropdown"&gt;
      &lt;div id="addDropdownfield"&gt;
          &lt;div id="div0"&gt;
              &lt;select name="0" style="margin: 20px" id="0"&gt;
                  &lt;option value="1"&gt;1&lt;/option&gt;
                  &lt;option value="2"&gt;2&lt;/option&gt;
              &lt;/select&gt;
              &lt;input style="margin: 7px" id="1" placeholder="Value" onkeyup="check_if_value_set(this); return false;"
                     type="text"&gt;
  
              &lt;span style="margin: 7px;cursor: pointer;" onclick="remove_fields(this);return false;"&gt;&lt;iclass="fa fa-times"&gt;&lt;/i&gt;&lt;/span&gt;
          &lt;/div&gt;
  
          &lt;div id="div2"&gt;
              &lt;select name="2" style="margin: 20px" id="2"&gt;
                  &lt;option value="1"&gt;1&lt;/option&gt;
                  &lt;option value="2"&gt;2&lt;/option&gt;
              &lt;/select&gt;
              &lt;input style="margin: 7px" id="3" placeholder="Value" onkeyup="check_if_value_set(this); return false;"
                     type="text"&gt;
  
              &lt;span style="margin: 7px;cursor: pointer;" onclick="remove_fields(this);return false;"&gt;&lt;i class="fa fa-times"&gt;&lt;/i&gt;&lt;/span&gt;
          &lt;/div&gt;
  
          &lt;div id="div4"&gt;
              &lt;select name="4" style="margin: 20px" id="4"&gt;
                  &lt;option value="1"&gt;1&lt;/option&gt;
                  &lt;option value="2"&gt;2&lt;/option&gt;
              &lt;/select&gt;
              &lt;input style="margin: 7px" id="5" placeholder="Value" onkeyup="check_if_value_set(this); return false;"
                     type="text"&gt;
              &lt;span style="margin: 7px;cursor: pointer;" onclick="remove_fields(this);return false;"&gt;&lt;i class="fa fa-times"&gt;&lt;/i&gt;&lt;/span&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  
      &lt;a href="javascript:void(0)" onclick="show_new_text_field(this);event.preventDefault();return false;" style="cursor:pointer"&gt;
  
      &lt;span id="add_new_span" class="addnew" style="float: none;margin-left: 1%;"&gt;&lt;i class="fa fa-plus fa-fw"&gt;&lt;/i&gt;Add New Field&lt;/span&gt;
  
      &lt;/a&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>You can see there is a function named &quot;show_new_text_field(this)&quot; at the bottom of the code. Using this function, i need to get the id of say, div4 or select box of id 4. How can this be done ? I tried using prent() and closest(). Nothing worked. Any type of suggestions would be appreciated.
  Thanks in advance !!</p>