Function update string or value if checkbox is checked
<p>I'm trying to write a <code>function</code> which returns the <code>value</code> from <code>input:radio</code> or <code>text()</code> from <code>span</code>, when <code>checkbox</code> is checked.</p>

<p>It is not necessary to return both. Either one or the other would be helpful.</p>

<p>This is <code>html</code> template example:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$('input.choose-age').on('change', function() {
  $('input.choose-age').not(this).prop('checked', false);
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/&gt;
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;div class="checkbox"&gt;
  &lt;div class='col-xs-3 col-md-2'&gt;
    &lt;input type="radio" id='wom-10-14 age' class='choose-age' value='10-14' checked /&gt; &lt;span class='text-left'&gt;10-14&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class='col-xs-3 col-md-2'&gt;
    &lt;input type="radio" id='wom-15-19 age' class='choose-age' value='15-19' /&gt; &lt;span class='text-left'&gt;15-19&lt;/span&gt;
  &lt;/div&gt;
  &lt;div class='col-xs-3 col-md-2'&gt;
    &lt;input type="radio" id='wom-10-19 age' class='choose-age' value='10-19' /&gt; &lt;span class='text-left'&gt;10-19&lt;/span&gt;
  &lt;/div&gt;
&lt;/div&gt;</code></pre>
</div>
</div>
</p>

<p>This is what I have tried so far:</p>

<p><strong>Attempt 1</strong></p>

<pre><code>function ageLabel() {
    var label = $('input:radio').change(function() {
        var result = $('input:radio:checked').map(function() {
            var age = $(this).next('span').text();
            return age;
        }).get();
        return result[0];
    });
    return label;
};
</code></pre>

<p><strong>Attempt 2</strong></p>

<pre><code>function ageLabel() {
    $('#age').click(function() {
        if ($(this).is(':checked')) {
            var result = $(this).next('span').text();
        };
        return result;
    });
};
</code></pre>

<p><strong>Attempt 3</strong></p>

<pre><code>function ageLabel() {
    $('input:radio').click(function() {
        if ($(this).is(':checked')) {
            var results = $('input:radio:checked').map(function() {
                var aged = $(this).next('span').text();
                return aged;
            }).get();
            return results[0];
        };
    });
};
</code></pre>

<p><strong>Attempt 4</strong></p>

<pre><code>function ageLabel() {
    d3.selectAll('#age').on('change', function() {
        val = this.value;
        return val;
    });
};
</code></pre>

<p>Each code above doesn't return the new <code>value</code> or <code>text()</code> when different <code>input</code> is checked.</p>

<p>How can I achieve this result?</p>

<p>Cheers!</p>