Question

I have multiple level DOM elements, But I still finding how to select DOM element.
My html here.

<div class="data">
  <div class="item">
    <form class="comment" method="post" action="">
      <div class="d1">
        <a href="">Tree</a>
        <p>
        </p>
      </div>
      <div class="d2">
        <p class="quote">
      </div>
      <div class="col p3">
        <input type="hidden" name="token" value=""/><input type="hidden" name="u" value=""/><input type="button" class="button" name="submit"/><br>
        <abbr class="selected_dom" title="2012-07-05T11:29:22Z">July 1, 2012</abbr>
      </div>
    </form>
  </div>
</div>

Can you please help me how to select this <abbr class="selected_dom" title="2012-07-05T11:29:22Z">July 1, 2012</abbr> ?

Answer 1

Use this:

// select abbr element with class selected_dom, inside form with class comment
var abbr = $('form.comment abbr.selected_dom');

Depending on your HTML structure, you may just want to select abbr elements:

var abbr = $('abbr');

Read more about selectors (general) and element selector