Using innertext in Javascript to capture a value

Question

I am trying to capture the value 'Lusaka' in the following HTML of the page using Javascript

<div class="flight-list-container" id="outbounds">

        <div data-wl-section="itineraryHeader" class="flight-list-section flight-list-header-container" id="outbounds-header-container">
            <div class="flight-info">
                <h2 class="translate wasTranslated" data-wl-translate="label.flc.itineraryHeader.departing">Outbound flight</h2>
                <div class="xchnge-section-dl">
                    <span class="translate xchnge-section-dt wasTranslated" data-wl-translate="label.flc.itineraryHeader.flyingFrom">From</span>
                    <span class="xchnge-section-dd"><span class="translate wasTranslated" data-wl-translate="City.LHR">London</span>, <span class="translate wasTranslated" data-wl-translate="Country.GB">United Kingdom</span> (LHR)</span>
                    <span class="translate xchnge-section-dt wasTranslated" data-wl-translate="label.flc.itineraryHeader.flyingTo">To</span>
                    <span class="xchnge-section-dd"><span class="translate wasTranslated" data-wl-translate="City.LUN">Lusaka</span>, <span class="translate wasTranslated" data-wl-translate="Country.ZM">Zambia</span> (LUN)</span>
                </div>
<p class="translate wasTranslated" data-wl-translate="label.flc.itineraryHeader.disclaimer">Lorem ipsum</p>            </div>
        </div>

using the following code but don't know how to distinguish between the class holding the FlyingFrom and the FlyingTo values

function() {

var destination = document.getElementById("outbounds-header-container").getElementsByClassName("translate wasTranslated")[1].innerText

return destination

}

I am using it within Google Tag Manager to set the value of a GTM variable called Destination — Munali, Aug 31 '16 at 05:49
And when is that function called? On change, on click, on document ready? — KondukterCRO, Aug 31 '16 at 05:54

score 0 · Answer 1 · answered Aug 31 '16 at 05:58

0

You can us jQuery and get the values by following code

$('.xchnge-section-dl > span.translate').each(function(){
  alert( $(this).text()); //text in the container
})

Hope this helps!!

answered Aug 31 '16 at 05:58

Gandharv

110
6

Thanks very much but isn't it possible to do it without jQuery? – Munali Aug 31 '16 at 06:59
you can try this http://stackoverflow.com/questions/9427311/how-to-get-all-elements-by-class-name – Gandharv Aug 31 '16 at 08:09
Thanks - but I think my problem is that the class names are the same so I can't distinguish them between each other – Munali Aug 31 '16 at 10:19

Using innertext in Javascript to capture a value

1 Answers1