Question

After some digging, I’m still not getting any close with this.

I have a html string produced by this php…

This strips out all multiple white spaces.

For example the above outputs this string below, no other nodes contained, just text…

 1 Lorem ipsum 1.1 Dolor sit amet, consectetur adipiscing elit. 1.2 Nulla non felis enim, a lacinia erat. 1.3 Donec ullamcorper feugiat lobortis. 1.4 Vivamus congue libero ut augue consectetur ultricies vitae eget quam. 2 Suspendisse 2.1 Ultrices volutpat tempus. 2.2 Aenean ullamcorper porta lacus, ut vehicula tortor dapibus hendrerit. 2.3 Proin condimentum est eget arcu mollis consequat. 2.4 Ut malesuada posuere lobortis. 2.5 Suspendisse gravida adipiscing nunc, et vehicula nunc tincidunt nec. 3 Tincidunt 3.1 Sed eget porta ligula. 3.2 Morbi vitae augue in eros tincidunt tincidunt consequat interdum dui. 3.3 Phasellus ante velit, venenatis et dignissim eu, semper vitae lectus. 3.4 Maecenas feugiat adipiscing tortor, non porttitor sem condimentum luctus. 3.5 Curabitur pharetra gravida ornare. 3.6 Donec tortor erat, posuere in ullamcorper eget, posuere sit amet purus. 3.7 Duis feugiat sollicitudin odio, ac molestie nulla elementum non. 4 Vestibulum 4.1 Tempor lectus sit amet purus condimentum nec condimentum dui viverra. 4.2 Duis sodales molestie fermentum. 4.3 Maecenas euismod, lacus ut ullamcorper condimentum, erat felis sodales lectus, a sodales ipsum lectus eu lorem. 4.3 Vivamus ac rhoncus est.

I am trying to find away of find all the numbers (1 , 1.2 , 1.3 , etc) and wrap them in a span.

I tried php but I was not having much luck…

$phrase  = "You should eat fruits, vegetables, and fiber every day.";
$healthy = array("fruits", "vegetables", "fiber");
$yummy   = array("pizza", "beer", "ice cream");

$newphrase = str_replace($healthy, "<span>".$yummy."</span>", $phrase);

echo $newphrase;

the above php is outputting this… You should eat Array, Array, and Array every day.

So I thought I could maybe try jquery, but I’m not sure if I’m approaching it correctly, please my code…

var points = [' 1 ',' 1.1 ',' 1.2 ',' 1.3 ',' 1.4 ',' 2 '];

$("p").html(this.html().replace( points,'<span>' + points + '</span>'));

I think I’m way off track but I can’t really find much on pin pointing specific bits of string.

I made a fiddle of my jQuery… http://jsfiddle.net/XmU6p/

I guess in the mean time, I’m going to still pursue this problem. But if anyone could please share some pointers as to where I’m going wrong, I would be most grateful. Thanks

Answer 1

In both cases you need to actually loop through the array of values and do the replacement for each value. I’m not too familiar with PHP, so I’ve made an example using jQuery. Try this:

var points = [' 1 ',' 1.1 ',' 1.2 ',' 1.3 ',' 1.4 ',' 2 '];
$.each(points, function(i, val) {
    var $p = $('p');
    $p.html($p.html().replace(val, '<span>' + val + '</span>'));
});

Updated fiddle