bootstrap单选按钮标签样式

Question

我尝试设置我的引导单选按钮，如下所示 -

默认情况下

标签：透明背景和绿色字体

点击后的

标签（即选中后）：绿色背景颜色和白色字体

<div id ="trial" data-toggle="buttons">     
<label class="btn btn-success btn-outline"><input type="radio" name="sex" value="M">Male</label>
<label class="btn btn-success btn-outline"><input type="radio" name="sex" value="F">Female</label>   
</div>

我尝试使用'active'和'focus'但是当我点击其他地方时它会返回默认值。有没有办法保持“点击后的标签”（选中单选按钮），即使它被点击到其他地方。

这是我的代码： https://jsfiddle.net/muchproblem/4vmucdq7/17/

提前致谢