I generate few boxes at runtime, where I want to confirm if all the boxes contains text Empty, then the user should not be able to proceed. But if even a single Box contains the correct value of box (instead of Empty), then user should be able to proceed.

Please find me code below:

HTML

<div>

    <div class=bin-area empty floatLeft style=width:242px; height:130px; >

        <label for=9>

            <div class=bin data-binid=0 data-cols=0 data-rows=0>

                <div class=number>S9</div>

                <input class=floatLeft styled id=9 name=checkbox9 type=checkbox />

                <label for=9><span class=floatLeft marginLeft40>Empty</span>



                </label>

                <div class=type></div>

                <div class=description>Storage</div>

            </div>

        </label>

    </div>

    <div class=bin-area empty floatLeft style=width:242px; height:130px; >

        <label for=9>

            <div class=bin data-binid=0 data-cols=0 data-rows=0>

                <div class=number>S9</div>

                <input class=floatLeft styled id=9 name=checkbox9 type=checkbox />

                <label for=9><span class=floatLeft marginLeft40>Empty</span>



                </label>

                <div class=type></div>

                <div class=description>Storage</div>

            </div>

        </label>

    </div>

    <div class=bin-area style= width:242px; height:130px; >

        <label for=8>

            <div class=bin data-binid=5 data-cols=9 data-rows=5>

                <div class=number>S8</div>

                <input class=floatLeft styled id=8 name=checkbox8 type=checkbox />

                <div class=type>9x5 Storage Bin</div>

                <div class=description>Est. Capacity: 121 pkgs</div>

            </div>

        </label>

    </div>

</div>

<div style=clear:both></div>

<div role=button style=margin-top:20px>

    <input type=button id=stepAutomap value=Automap class=active />

    <input type=button id=stepAutomapBack value=Back class=active marginLeft50 />

    <input type=button id=stepAutomapConfirm value=Confirm &amp; Proceed class=marginLeft10 />

</div>

This is my HTML structure... by searching some of the existing posts, I tried creating some IF logic using jQuery :

I tried this option:

$(document).ready(function () {

    $('.bin-area').each(function () {

        if ($(this).text() == 'Empty') {

            alert(Empty);

        }

    });

});

And this option:

$(document).ready(function () {

    if ($(span.floatLeft).contains(Empty)) {

        alert(Empty);

    }

});

But nothing worked!

I have also created a fiddle to refer or try!

Please refer the fiddle: http://jsfiddle.net/aasthatuteja/xJtAV/

Let me know if you need any other info.

Please suggest!