Need to wrap specified content

Question

This is my code, this message coming from dynamicaly

<div class="left">6 item(s) - Page 1 of 3 </div>

Need to change

<div class="left"> <span>6</span> item(s) - Page <span>1</span> of <span>3</span> </div>

Any idea ?

see this: [link](http://stackoverflow.com/questions/10896332/jquery-wrap-multiple-div-elements-on-same-class/10897813#10897813) — Alex Ball, Jun 06 '12 at 06:12

score 2 · Accepted Answer · answered Jun 06 '12 at 06:15

2

var div = $('.left');
div.html(div.html().replace(/(\d+)/g, '<span>$1</span>'));

answered Jun 06 '12 at 06:15

xdazz

158,678
38
247
274

1

When will I learn regex :(. Anyways +1 for such a nice and precise solution. – Jashwant Jun 06 '12 at 06:27

score 1 · Answer 2 · answered Jun 06 '12 at 06:10

1

Split the text by "Space". You will get the array of items. Take the index, I thought It will always same and add your "span" on that.

answered Jun 06 '12 at 06:10

Sudip Pal

2,041
1
13
16

score 1 · Answer 3 · answered Jun 06 '12 at 06:26

This works for me. I simply check if a word is a number. If yes, I wrap it inside a span

var left = $('.left');
var html = left.html().split(' ');
for(var i=0,len=html.length;i<len;i++){ 
    if(!isNaN(html[i]) && html[i]!=''){
        html[i] = '<span>' + html[i] + '</span>';
    }
}
left.html(html.join(' '));

score 1 · Answer 4 · answered Jun 06 '12 at 06:30

1

Use the implicit looping that comes natively in jQuery to reset the html of each matched element.

$(".left").html(function(i,v){
    return v.replace( /(\d+)/g, "<span>$1</span>" );
});

Fiddle: http://jsfiddle.net/jonathansampson/gEYEE/

answered Jun 06 '12 at 06:30

Sampson

265,109
74
539
565

Need to wrap specified content

4 Answers4