Eliminating text lines from a result of a JS pull

Question

So I have a script that pulls an complete address block to be placed within a field of my choosing that works but now I am trying to eliminate unneeded parts of the resulting block of text for display.

The code:

<script>
 Sys.Application.add_load(
    function SetShipInfoValue()
    {
        var obj = document.getElementById("StepArea_UpdatePanelAddressBlock");

        if(obj == null)
        {
            var y = document.getElementsByClassName('ShippingAddressBlock');
            obj = y[0];
        }


        if(obj != null)
        {
            var txt = obj.innerHTML;
            var obj2 = document.getElementById("FIELD_1841");
            if(obj2 != null)
            {
                obj2.value = txt;
            }
        }

    });
</script>

The result:

<div class="ShippingAddressBlock">
<div>Store 169</div> 
<div>General Manager</div> 
<div>1740 East Rd</div> 
<div></div> 
<div>Santa Clara, CA 92705</div> 
<div></div> 
<div></div>
<div>169</div>
</div>

How would I eliminate lines of text from the result to just display just the store number within the JS?

Answer 1

You can do this by getting the last child from .children :

 var ele = document.getElementsByClassName("ShippingAddressBlock")[0]; console.log(ele.children[ele.children.length-1].innerHTML); // 169 

 <div class="ShippingAddressBlock"> <div>Store 169</div> <div>General Manager</div> <div>1740 East Rd</div> <div></div> <div>Santa Clara, CA 92705</div> <div></div> <div></div> <div>169</div> </div> 

You can also use:

console.log(ele.lastChild.previousSibling.innerHTML);

Which will be supported in older browsers.

Answer 2

You can use Jquery filter like this https://jsfiddle.net/DIRTY_SMITH/em0z4p84/2/

<div class="ShippingAddressBlock">
  <div>Store 169</div>
  <div>General Manager</div>
  <div>1740 East Rd</div>
  <div></div>
  <div>Santa Clara, CA 92705</div>
  <div></div>
  <div></div>
  <div>169</div>
</div>

<script>
  $(".ShippingAddressBlock > div").filter(function(index) {
    if (index === 0) {
      $(this).attr('id', 'show');
    }
  });

</script>

CSS

.ShippingAddressBlock > div {
  display: none;
}

.ShippingAddressBlock > #show {
  display: inline;
}