DOM select all html content between two specific tags JS or JQuery

Viewed 110

I have something like this in html:

<p class ="aa">Something<p>
<p class ="bb">Another thing<p>
<p class ="cc">Something else<p>
<p class ="aa">Things are coming<p>
<p class ="dd">Too much things<p>
<p class ="ee">Neverending things<p>
<p class ="aa">Best thing ever<p>

And I want to select and store in a variable every tags between two tags with the "aa" class. (The goal is to store each result in a JSON file) How can I proceed with vanilla JS or Jquery? Thank you for your response.

1 Answers

You can probably do something like this

let selectedTags = []
let allTags = document.querySelector(".aa").parentNode.children
for (let i = 1; i < allTags.length; i++) { //1 to skip the first aa element
  if (allTags[i].className.includes("aa")) {
    break;
  }
  selectedTags.push(allTags[i])
}

After that, you can iterate over selectedTags to do whatever you want with them, including storing variables.

Related