How to make Jquery redirect with bootstrap label
<p>bootstrap navigation has following code and i want to make when i click label should redirect different pages</p>

<pre><code>&lt;li class="btn-group-lst"&gt;
 &lt;div id="gender-btn" class="btn-group" data-toggle="buttons"&gt;                            
    &lt;label class="btn btn-default gender-select"&gt;
        &lt;input type="radio" name="options" id="option2" autocomplete="off"&gt;
        &lt;span&gt;US&lt;/span&gt;
    &lt;/label&gt;
    &lt;label class="btn btn-default gender-select"&gt;
        &lt;input type="radio" name="options" id="option2" autocomplete="off"&gt;
        &lt;span&gt;UK&lt;/span&gt;
    &lt;/label&gt;
 &lt;/div&gt;&lt;/li&gt;                    
</code></pre>

<p>My j-query is here.  </p>

<pre><code>$('.gender-select :option1').on('click', function(){
        window.location.href = '&lt;?=site_url('main/us_details')?&gt;';
    });

$('.gender-select :option2').on('click', function(){
        window.location.href = '&lt;?=site_url('main/uk_details')?&gt;';
    });
</code></pre>