I'm iterating through the following sets of li elements to retrieve the data- featuredtext attribute and return in HTML format.
Each expanded list element gets the og-expanded class. I'm trying to retrieve the data attribute of just the list with the expanded class, but everytime I run my jquery, it returns attributes of all the list elements.
$(".link-text").each(function(i) {
var text = $(this).data('featuredtext');
$(".og-featured__links").append(text).html();
console.log(text);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<li style="transition: height 350ms ease 0s; height: 275px;" class="og-expanded">
<a data-largesrc="https://7162402.fs1.hubspotusercontent-na1.net/hubfs/7162402/Digication%20Website%202022/How%20It%20Works%20Page/Writing%20Across%20the%20Curriculum.png" data-title="Writing Across the Curriculum" data-description="2 - This is a description. Just a description. More to come. This is a description. Just a description. More to come. This is a description. Just a description. More to come.">
</a><a class="link-text" data-featuredtext="<h6>Case Study</h6>" href="https://digication.com/case-2-study"></a>
<a class="link-text" data-featuredtext="<h6>Examples</h6>" href="https://digication.com/examples-2"></a>
<a class="link-text" data-featuredtext="<h6>Resouces</h6>" href="https://digication.com/resources-2">
<img src="https://7162402.fs1.hubspotusercontent-na1.net/hubfs/7162402/Digication%20Website%202022/How%20It%20Works%20Page/Thumbnails/Writing%20Across%20the%20Curriculum.png" alt="How Digication works - Writing Across the Curriculum" loading:="" "lazy"="">
<div class="meta__thumbnail">
<h3><div id="hs_cos_wrapper_module_16530649813223_" class="hs_cos_wrapper hs_cos_wrapper_widget hs_cos_wrapper_type_inline_text" style="" data-hs-cos-general-type="widget" data-hs-cos-type="inline_text" data-hs-cos-field="thumbnail_title">Writing Across the Curriculum</div>
</h3></div>
</a>
</li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
I need a better way to iterate with jquery that doesn't return data attributes from all list elements but only the one with .og-expanded class.