title: Javascript: get children by tag type
body: <p>I have a situation where the server-side is producing resultant HTML of the form:</p>
  
  <pre><code>&lt;div id="myDiv"&gt;
      &lt;ul&gt;
          &lt;li class="imageElem"&gt;
              &lt;img src="..."/&gt;
              &lt;div id="imgInfo"&gt;
                  &lt;p class="imgDetail"&gt;
                      Image Title #1
                  &lt;/p&gt;
              &lt;/div&gt;
          &lt;/li&gt;
  
          &lt;!-- Etc. for many images (1 &lt;li&gt; per &lt;img&gt;) --&gt;
  
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I am trying to loop through this list and perform on-the-fly DOM manipulation with jQuery. I'm running into three bottlenecks:</p>
  
  <ul>
  <li>How to obtain <code>myDiv</code>'s single <code>&lt;ul&gt;</code> child that has neither an <code>id</code> or <code>class</code> (and to change the server-side code to produce one of these will be a <strong>nightmare</strong>); and</li>
  <li>How to obtain each <code>&lt;li&gt;</code>'s single <code>&lt;img&gt;</code> child; same as above for getting the server to generates id/class attributes; and</li>
  <li>How to obtain each <code>&lt;li&gt;</code>'s single <code>&lt;p&gt;</code> child's text (e.g. "Image Title #1")</li>
  </ul>
  
  <p>I am trying the following (for each of those three issues respectively) to no avail:</p>
  
  <pre><code>var myDivUL = document.getElementById("myDiv").ul;
  for(i = 0; i &lt; myDivUL.length; i++)
  {
      var currImageElem = myDivUL[i].img;
      var currPText = myDiv[i].div.p.text;
  
      // ... rest of function omitted for brevity
  }
  </code></pre>
  
  <p><strong>What am I doing wrong here?</strong> What doe I need to change to get the three elements without having access to id/class attributes? Thanks in advance!</p>