Selector: Selecting elements in a page

Questions
1

Hi
My issue concerns selecting elements inside

. So basically I am doing this:
  1. Have regular site structure with view-main etc.
  2. Switch between pages inside view-main using router
  3. Each page ( class=“page” ) has invisible tag with an unique data-id. For example
    <span class="myData" style="visibility: hidden" data-id="1234567" >
    next one I switch to:
    <span class="myData" style="visibility: hidden" data-id="7654321" >
    etc
  4. Try to select this tag by class(myData).
  5. The result is always the first page data id ie here: 1234567
  6. Check DOM inspector in a browser. The data id is: 7654321
  7. So basically selector’s DOM memory data doesnt get updated with the replaced page data.

I tried possibile solutions:

  1. Use id instead of class for myData: The same
  2. Use data-ignore-cache=“true”: The same
  3. Selecting in a more fancy way (.view-main > .page > .myData’).attr(‘data-id’): the same

It seems more like a Selector/JQuery contruction thing than F7 issue, but I cannot find any workaround to solve it.

Thanks in advance.

2

OWN SOLUTION!
It seems that the Selector keeps all shown pages cached somewhere in the DOM even with data-ignore-cache=“true”. So using a tag with a class to identify a page doesnt allow you to select only one page. Instead you only browse though all pages that were in the view. So to identify the current page and retrieve its id you must use selection formula containing ‘page-current’ which is a class added to the current visible page.
Given the data in the OP it would be:

$$('.page-current > .myData').attr('data-id');