Jquery find doesn't work

Question

I have a problem to get the content of the span (Arrière in this example), when its parent (li) contains a span with class 'checked'

This is my html

<fieldset class="attribute_fieldset">
    <label class="attribute_label">Base du siège &nbsp;</label>
        <div class="attribute_list">
            <ul>
                <li>
                    <div class="radio">
                        <span class="checked">
                            <input type="radio" class="attribute_radio" name="group_4" value="26" checked="checked">           
                        </span>
                    </div>
                   <span>Arrière</span>
                </li>
            </ul>
        </div> <!-- end attribute_list -->
</fieldset>

I tried this jquery code:

$('.attribute_fieldset').each(function( index ) {
    var attribute_label = $(this).children('.attribute_label').html();
    var attributeval = $(this).find('.checked').parent('.radio').next('span').html();
    console.log(attributeval);
    var that = this;    
  $('#product_attributes').append('<li>'+attribute_label.replace('&nbsp;','')+':');

});

I got undefined for attributeval

Answer 1

This should work:

$('.attribute_fieldset').each(function() {
   $('#product_attributes').append('<li>' + $(this).find('attribute_label').html().replace(' &nbsp;', '') + ':' + $(this).find('li span.checked').parent().next('span').html() + '</li>');
});

Answer 2

Instead you can try below code:
$(".attribute_fieldset span").each(function(index, spanElement) {
    if($(spanElement).parent().find("span.checked").length
         && !$(spanElement).hasClass("checked")) {
        console.log(spanElement); // this is the span element you want
        console.log(spanElement.text()); // this is the value "Arrière"
      }
});