title: How can I get an element's attribute from the parent's parent element's ID using JavaScript?
body: <p>So I have the following HTML...</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div id="col1"&gt;
      &lt;img src="1.jpg"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And I am implementing a HTML5 drag and drop feature where the inner html of <code>col1</code> is changed for the dragged element's inner html - so basically the columns change their content.</p>
  
  <p>I have another div (let's call that <code>swap-text</code>) where I want to change its text content depending on what image is presently inside <code>col1</code>.</p>
  
  <p>This is why I want to figure out how I can obtain <code>col1</code>'s <code>img</code> element's <code>src</code> attribute value through JavaScript so I can then write an <code>if</code> statement to change the content of the <code>swap-text</code> depending on which image is in <code>col1</code>.</p>
  
  <p>I could add ID's to the <code>img</code> elements but then I still don't know how I would write the condition to check if say, <code>img-id1</code> parent is <code>col1</code>.</p>
  
  <p>Attempt(s):</p>
  
  <pre><code>var doc = document.getElementById("col1");
  var children = null;
  var imgEle;
  
  //gets img node, but also got 1/2 text object(s)?
  for (var i = 0; i &lt; doc.childNodes.length; i++) {
      children = doc.childNodes[i];
      console.log(children);
  }
  
  //document.getElementById("img")
  //children[1].getAttribute('src'); - cannot call method 'getAttribute' of undefined 
  
  
  //imgEle = doc.childNodes[0].getElementById('img'); - Object #&lt;Text&gt; has no method 'getElementById'
  
  console.log(imgEle);
  console.log(children);
  </code></pre>