jQuery:拆分字符串并将 html 附加到拆分元素

Question

有多个事件日期div。

HTML:

 <div class="event-dates">Aug 28</div>
 <div class="event-dates">Aug 28</div>
 <div class="event-dates">Aug 28</div>
 <div class="event-dates">Aug 28</div>

JQuery:

 jQuery.noConflict();
 jQuery(document).ready(function(){
      jQuery(".event-dates").each(function() {
           jQuery(this).html(jQuery(this).html().replace(/ /g, '<br />'));
      });

 });

我想要像第一个附加图像那样的输出。是否可以拆分字符串并附加 html？

或

还有其他方法可以得到这样的输出吗？

预期结果如第一张图所示

Answer 1

基于评论

jQuery.noConflict();
jQuery(document).ready(function() {
    jQuery(".event-dates").html(function(idx, html) {
        return html.replace(/([a-z]+)\s(\d+)/i, '<span class="firest">$1</sapn><span class="day">$2</span>')
    });
});

演示:Fiddle