Devz Devz - 3 months ago 8
HTML Question

Can't find a way to select specific elements with JQuery

I'm trying to select theses elements with JQuery :

<div attribute="distinct-value"> <!-- i only want links in this one, select based on the attribute -->
<div>
<div>
<div class="col1">
<ul>
<li>
<a href="link"></a> <!-- i want this -->
<ul>
<li><a href="useless_link"></a></li>
<li><a href="useless_link"></a></li>
<li><a href="useless_link"></a></li>
<li><a href="useless_link"></a></li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="link"></a> <!-- and this... -->
<ul>
<li><a href="useless_link"></a></li>
</ul>
</li>
</ul>
</div>
<div class="col2">
<ul>
<li>
<a href="link"></a> <!-- and this... -->
<ul>
<li><a href="useless_link"></a></li>
<li><a href="useless_link"></a></li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="link"></a> <!-- and this... -->
<ul>
<li><a href="useless_link"></a></li>
<li><a href="useless_link"></a></li>
<li><a href="useless_link"></a></li>
</ul>
</li>
</ul>
</div>
<!-- col3, col4, etc, etc... -->
</div>
</div>
</div>
<div attribute="another-distinct-value">
<!-- same content structure has 'distinct-value div' -->
</div>
<div attribute="another-other-distinct-value">
<!-- same content structure has 'distinct-value div' -->
</div>


I want the first link in the first li of every ul markups that are not inside a li, for every div that has a "col" class. I hope everything is clear..

Can someone help me out ?

Answer

Loop through your elements like so

$('div[attribute="distinct-value"] [class^=col] li:has(ul) > a').each(function(index) {
   console.log( index + ": " + $( this ).text() );
  });
Comments