Question

I am having some html which looks like this
I need the innerHTML contents for address1 range, city range and state range classes respecively for different std-address classes.

<div id="result-list">
            <div class="data">
                    <p class="std-address">
                        <span class="address1 range">some html content</span>
                        <span class="city range">some html content</span>
                        <span class="state range">some html content</span>

                    </p>
                    <p class="std-address">
                        <span class="address1 range">some html content</span>
                        <span class="city range">some html content</span>
                        <span class="state range">some html content</span>

                    </p>
                    <p class="std-address">
                        <span class="address1 range">some html content</span>
                        <span class="city range">some html content</span>
                        <span class="state range">some html content</span>

                    </p>
            </div>
</div>

I wrote the below mentioned code which was working properly untill i tested that on IE 8 and below

var addArrayX = document.getElementById("result-list").getElementsByClassName("std-address");


            for (i=0;i<addArrayX.length;i++){
                var address = addArrayX[i];
                stLine1 = trim(((address.getElementsByClassName("address1 range"))[0]).innerHTML);
                city = trim(((address.getElementsByClassName("city range"))[0]).innerHTML);
                state =  trim(((address.getElementsByClassName("state range"))[0]).innerHTML);
            }

Kindly help me in making this code IE compatible(using js prefererably or by jQuery)

here is the link for html
http://jsfiddle.net/H3HRN/9/

Answer 1

if you want to use jquery then try this:

     $("[id*='result-list']").find("p[class*='std-address']").each(function () {
        var address = $(this).children("span[class*=address1]").html();
        var city = $(this).children("span[class*=city]").html();
        var state = $(this).children("span[class*=state]").html();

    });

see here : http://jsfiddle.net/H3HRN/20/