如何包装每个字母标记“跨度”，并添加相同的id(how to wrap each letter to

这是我现在有： DEMO

需要为每个字母添加ID相同字母跨度......是这样的：

<span id="t">t</span>
<span id="e">e</span>
<span id="s">s</span>
<span id="t">t</span>

谢谢

HTML：

<div id="page-wrap">
<div class="form_floleft">
    <form>
        <label for="">Your word:</label> <input class="text_field" type="text" name="your_word" placeholder="enter here">
    </form>
    <div class="enter">ENTER</div>
</div>
<div class="txt"></div>
<p></p>

</div>

JS：

(function($){
jQuery(document).ready(function(){
$(".enter").live('click', function(){
        var value = jQuery("input.text_field").val();
        jQuery(".txt").text(value);
        var words = $('.txt').text().split("");
        var text = words.join("</span><span>");
        $("p").html("<span>" + text + "</span>");
    });
});
})(jQuery);

Answer 1:

为什么不尝试：

(function($){
jQuery(document).ready(function(){
$(".enter").live('click', function(){
    var value = jQuery("input.text_field").val();
    jQuery(".txt").text(value);
    var words = $('.txt').text().split("");
    for (i in words)
        words[i] = '<span id="' + words[i] + '">' + words[i] + '</span>';   
    var text = words.join('');
    $("p").html(text);
});
});
})(jQuery);

文章来源: how to wrap each letter to tag “span” and add the same id