text-align与val()

近日，在项目中，自定义一个选框，如下：

<input type="text" value="女"/> 

选框男、女两项，css中设置input为

text-align:right;

当获取到

<span>男</span>
<span>女</span>

的.text();然后传到input中

var _value = $('span').text();
$('input').val(_value);

然而，万万没想到，css的right对齐罢工了，内容完全是按left来展示的。
test1:

$('input').val('男');

喔，right显示。
test2:

$('span')[0].innerHTML;

(⊙o⊙)哦，left显示。
test3:

$('span')[0].innerText;

oooooo,right显示；
测试暂时未做深究，日后再来补充。