Question

<ol id="author_list">
    <li id="author_8"><div class="author">Author 1</div>
        <ol>
            <li class="affiliation_7"><div class="affiliation">School1</div>
            </li>
            
            <li class="affiliation_8"><div class="affiliation">School2</div>
            </li>
        </ol>
    </li>
    <li id="author_10"><div class="author">Author 3</div>
        <ol>
            <li class="affiliation_7"><div class="affiliation">School1</div>
            </li>
        </ol>
    </li>
    <li id="author_9"><div class="author">Author 2</div>
        <ol>
            <li class="affiliation_8"><div class="affiliation">School2</div> 
            </li>
        </ol>
    </li>
</ol>

Which looks like this

I want to be able to loop through this list and store the exact position of the list in a json format so that I can reproduce the list in the same order later.

I’m not exactly sure how the json should look like but this is what I came up with. Not sure if this is the best way to store the data as well..

{
    "association1" : {
         "author": "author_8",
         "affiliation": {
             "affiliation_7": "0,0",
             "affiliation_8": "0,1"
         },
    "association2" : {
         "author": "author_10",
         "affiliation": {
             "affiliation_7": "1,0",
         },
    "association3" : {
         "author": "author_9",
         "affiliation": {
             "affiliation_8": "2,0",
         },       
}

My code so far

var indexList = [];
var level2 = $('#author_list li ol li')

level2.each(function() {
    var topIndex = $(this).index();
    var subIndex = $(this).parent().parent().index();
    indexList.push((topIndex, subIndex));    
    alert(indexList);
})

UPDATE

Just to clarify, the 0,0, 0,1 refer to the index values of School1 and School2 respectively under Author1 and so forth

Answer 1

You don’t really need the index values of the schools in order to reconstruct the list as you have the relative positions of the schools captured in the JSON structure.

Here’s some JQuery code that will build the JSON loosely based on Imdad’s schema:

var authors = [];
$('#author_list > li').each(function(){
  var author = {};
  author.id = $(this).attr('id').substring(7);
  author.name = $(this).find('div.author').text();

  author.schools = [];
  $(this).find('ol li').each(function(){
    var school = {};
    school.sid = $(this).attr('class').substring(12);
    school.name = $(this).find('div.affiliation').text();
    author.schools.push(school);
  });

  authors.push(author);
});

var authorsJson = JSON.stringify(authors);
console.log(authorsJson);

Formatted results look like:

[
  {
    "id":"8",
    "name":"Author 1",
    "schools":[
      {"sid":"7","name":"School1"},
      {"sid":"8","name":"School2"}
    ]
  },
  {
    "id":"10",
    "name":"Author 3",
    "schools":[
      {"sid":"7","name":"School1"}
    ]
  },
  {
    "id":"9",
    "name":"Author 2",
    "schools":[
      {"sid":"8","name":"School2"}
    ]
  }
]