I have something like this in html:

```html
<div class ="personal-datas">Datas</div>
<h2 class ="name">Jack Bauer</h2>
<div class ="date-of-birth">february the 9th 1984</div>
<h3 class ="company">Jane Ventures</h3>
<h5 class ="status">married</h5>
<p class ="country">Canada</p>
<div class ="personal-datas">Datas</div>
<h2 class ="name">Clarice Sterling</h2>
<div class ="date-of-birth">3rd of March 1981</div>
<h3 class ="company">FBI</h3>
<h3 class ="chasing">Buffalo Bill</h3>
<h3 class ="skill">Profiler</h3>
<h5 class ="status">Bachelor</h5>
<p class ="country">USA</p>
<div class ="personal-datas">Datas</div>
```

And I want to select and store in a JSON file everything between two tags with the "personal-datas" class to have something like this:

```json
{
  "personal-datas1":
    {
      "name": "jack bauer",
      "date-of-birth": "february the 9th 1984",
      "company": "Jane Ventures",
      "status": "married",
      "country": "Canada"
    },
  "personal-datas2":
    {
      "name": "Clarice Sterling",
      "date-of-birth": "3rd of March 1981",
      "company": "FBI",
      "chasing": "Buffalo Bill",
      "skill": "Profiler",
      "status": "Bachelor",
      "country": "USA"
    }
}

```

How can I proceed with vanilla JS or Jquery?
Thank you for your response.