JSFiddle - React, Tailwind, and code Playground

by davehol

HTML

<main>
  <article
    id="electric-cars"
    data-columns="3"
    data-index-pop="12314"
    data-parent="cars"
    data-camp-id="1234567">
    <!-- Electric car content -->
  </article>

  <article
    id="solar-cars"
    data-columns="3"
    data-index-pop="12315"
    data-parent="cars">
    <!-- Solar car content -->
  </article>

  <article
    id="flying-cars"
    data-columns="4"
    data-index-pop="12316"
    data-parent="cars">
    <!-- Flying car content -->
  </article>
</main>

JavaScript

// Find all elements with a data-columns attribute
const article = document.querySelector("#electric-cars");

// Find all elements with data-columns="3"
//const threeColumnArticles = document.querySelectorAll('[data-columns="3"]');
// You can then iterate over the results
//article.forEach((dataset) => {
 // console.log(article.dataset.indexPop);
//});
console.log(article.dataset.campId);