Question

I have the following markup:

<div style="width: 660px; border-bottom: 1px solid #3A3F46;">
            <div class="noplace_event_cont">
                <div style="float: left;">
                    <span class="title">Usual</span> 
                    <span class="desc">Free: <span class="free_place">19</span></span>
                </div>
                <div style="float: right;">
                    <div class="spinner_cont">
                        <input type="text" data-type="1" class="event_spinner" value="0" maxlength="1" style="width: 24px; margin-right: 16px; text-align: right;"><span class="ui-spinner ui-widget"><div class="ui-spinner-buttons" style="height: 41px; left: -16px; top: -13.0833px; width: 36px;"><div class="ui-spinner-up ui-spinner-button ui-state-default ui-corner-tr" style="width: 16px; height: 20.5px;"><span class="ui-icon ui-icon-triangle-1-n" style="margin-left: 16.5px; margin-top: 15px;">&nbsp;</span></div><div class="ui-spinner-down ui-spinner-button ui-state-default ui-corner-br" style="width: 16px; height: 20.5px;"><span class="ui-icon ui-icon-triangle-1-s" style="margin-left: 16.5px; margin-top: 15px;">&nbsp;</span></div></div></span>
                    </div>
                </div>

            </div>
            <div class="noplace_event_cont">
                <div style="float: left;">
                    <span class="title">VIP</span> 
                    <span class="desc">Free: <span class="free_place">6</span></span>
                </div>
                <div style="float: right;">
                    <div class="spinner_cont">
                        <input type="text" data-type="2" class="event_spinner" value="0" maxlength="1" style="width: 24px; margin-right: 16px; text-align: right;"><span class="ui-spinner ui-widget"><div class="ui-spinner-buttons" style="height: 41px; left: -16px; top: -13.0833px; width: 36px;"><div class="ui-spinner-up ui-spinner-button ui-state-default ui-corner-tr" style="width: 16px; height: 20.5px;"><span class="ui-icon ui-icon-triangle-1-n" style="margin-left: 16.5px; margin-top: 15px;">&nbsp;</span></div><div class="ui-spinner-down ui-spinner-button ui-state-default ui-corner-br" style="width: 16px; height: 20.5px;"><span class="ui-icon ui-icon-triangle-1-s" style="margin-left: 16.5px; margin-top: 15px;">&nbsp;</span></div></div></span>
                    </div>
                </div>

            </div>
    </div>

I want to find text in span with free_place class:

$(".event_spinner").each(function () {
            var max = $(this).parent(".noplace_event_cont").find(".free_place").text();
            alert(max);
        });

But, this code not working. max is undefined.
Thanks.

Answer 1

var max = $(this).closest(".noplace_event_cont").find(".free_place").text();

or

var max = $(this).closest(".free_place").text();