$("a[data-ga]").each(function(){
var ga = $(this).parents("[data-ga]").andSelf().map(function(){
return $(this).attr("data-ga");
});
ga = $.makeArray(ga).join('');
$("#ga").append("<li>"+ga+"</li>");
});
<div id="factor-mask">
<ul id="factors">
<li id="factor-1" class="ga-scope" data-ga="/factor_1">
<div class="details">
<h2>Factor 1 Title</h2>
<p>Factor 1 Description</p>
</div>
<div class="closeups">
<h3>Factor 1 Subtitle</h3>
<ol class="progress">
<li><a href="#factor-1-closeup-1" data-ga="/closeup_dot_1">closeup 1</a></li>
<li><a href="#factor-1-closeup-2" data-ga="/closeup_dot_2">closeup 2</a></li>
<li><a href="#factor-1-closeup-3" data-ga="/closeup_dot_3">closeup 3</a></li>
</ol>
<div class="closeup-mask">
<ul>
<li id="factor-1-closeup-1" class="ga-scope" data-ga="/closeup_1">
<p>Factor 1: Closeup 1</p>
<a class="prev" href="#factor-1-closeup-3" data-ga="/previous_arrow">previous closeup</a>
<a class="next" href="#factor-1-closeup-2" data-ga="/next_arrow">next closeup</a>
</li>
<li id="factor-1-closeup-2" class="ga-scope" data-ga="/closeup_2">
<p>Factor 1: Closeup 2</p>
<a class="prev" href="#factor-1-closeup-1" data-ga="/previous_arrow">previous closeup</a>
<a class="next" href="#factor-1-closeup-3" data-ga="/next_arrow">next closeup</a>
</li>
<li id="factor-1-closeup-3" class="ga-scope" data-ga="/closeup_3">
<p>Factor 1: Closeup 3</p>
<a class="prev" href="#factor-1-closeup-2" data-ga="/previous_arrow">previous closeup</a>
<a class="next" href="#factor-1-closeup-1" data-ga="/next_arrow">next closeup</a>
</li>
</ul>
</div>
</div>
<div class="more-factors">
<p>More factors:</p>
<ul>
<li><a href="#factor-2" data-ga="/factor_2_icon">Factor 2</a></li>
<li><a href="#factor-3" data-ga="/factor_3_icon">Factor 3</a></li>
</ul>
</div>
</li>
<li id="factor-2" class="ga-scope" data-ga="/factor_2">
<div class="details">
<h2>Factor 2 Title</h2>
<p>Factor 2 Description</p>
</div>
<div class="closeups">
<h3>Factor 2 Subtitle</h3>
<ol class="progress">
<li><a href="#factor-2-closeup-1" data-ga="/closeup_dot_1">closeup 1</a></li>
<li><a href="#factor-2-closeup-2" data-ga="/closeup_dot_2">closeup 2</a></li>
<li><a href="#factor-2-closeup-3" data-ga="/closeup_dot_3">closeup 3</a></li>
</ol>
<div class="closeup-mask">
<ul>
<li id="factor-2-closeup-1" class="ga-scope" data-ga="/closeup_1">
<p>Factor 2: Closeup 1</p>
<a class="prev" href="#factor-2-closeup-3" data-ga="/previous_arrow">previous closeup</a>
<a class="next" href="#factor-2-closeup-2" data-ga="/next_arrow">next closeup</a>
</li>
<li id="factor-2-closeup-2" class="ga-scope" data-ga="/closeup_2">
<p>Factor 2: Closeup 2</p>
<a class="prev" href="#factor-2-closeup-1" data-ga="/previous_arrow">previous closeup</a>
<a class="next" href="#factor-2-closeup-3" data-ga="/next_arrow">next closeup</a>
</li>
<li id="factor-2-closeup-3" class="ga-scope" data-ga="/closeup_3">
<p>Factor 2: Closeup 3</p>
<a class="prev" href="#factor-2-closeup-2" data-ga="/previous_arrow">previous closeup</a>
<a class="next" href="#factor-2-closeup-1" data-ga="/next_arrow">next closeup</a>
</li>
</ul>
</div>
</div>
<div class="more-factors">
<p>More factors:</p>
<ul>
<li><a href="#factor-3" data-ga="/factor_3_icon">Factor 3</a></li>
<li><a href="#factor-1" data-ga="/factor_1_icon">Factor 1</a></li>
</ul>
</div>
</li>
<li id="factor-3" class="ga-scope" data-ga="/factor_3">
<div class="details">
<h2>Factor 3 Title</h2>
<p>Factor 3 Description</p>
</div>
<div class="closeups">
<h3>Factor 3 Subtitle</h3>
<ol class="progress">
<li><a href="#factor-3-closeup-1" data-ga="/closeup_dot_1">closeup 1</a></li>
<li><a href="#factor-3-closeup-2" data-ga="/closeup_dot_2">closeup 2</a></li>
<li><a href="#factor-3-closeup-3" data-ga="/closeup_dot_3">closeup 3</a></li>
</ol>
<div class="closeup-mask">
<ul>
<li id="factor-3-closeup-1" class="ga-scope" data-ga="/closeup_1">
<p>Factor 3: Closeup 1</p>
<a class="prev" href="#factor-3-closeup-3" data-ga="/previous_arrow">previous closeup</a>
<a class="next" href="#factor-3-closeup-2" data-ga="/next_arrow">next closeup</a>
</li>
<li id="factor-3-closeup-2" class="ga-scope" data-ga="/closeup_2">
<p>Factor 3: Closeup 2</p>
<a class="prev" href="#factor-3-closeup-1" data-ga="/previous_arrow">previous closeup</a>
<a class="next" href="#factor-3-closeup-3" data-ga="/next_arrow">next closeup</a>
</li>
<li id="factor-3-closeup-3" class="ga-scope" data-ga="/closeup_3">
<p>Factor 3: Closeup 3</p>
<a class="prev" href="#factor-3-closeup-2" data-ga="/previous_arrow">previous closeup</a>
<a class="next" href="#factor-3-closeup-1" data-ga="/next_arrow">next closeup</a>
</li>
</ul>
</div>
</div>
<div class="more-factors">
<p>More factors:</p>
<ul>
<li><a href="#factor-1" data-ga="/factor_1_icon">Factor 1</a></li>
<li><a href="#factor-2" data-ga="/factor_2_icon">Factor 2</a></li>
</ul>
</div>
</li>
</ul>
</div>
<p>Google Analytics tagging list collected from links and formed by concatenation of data-ga attributes from their ancestors. (Scoped analytic tracking which conveys hierarchy)</p>
<ul id="ga"></ul>
#factor-mask,
.closeup-mask {
width:300px;
overflow:hidden;
position:relative;
}
#factors,
.closeups ul {
width:900px;
position:relative;
}
#factor-1, #factor-2, #factor-3,
.closeups ul li {
width:300px;
float:left;
}