Breaking the span's text by ", "

Question

I have a <span> which contains a list of skills separated by a comma and a space. Now with jQuery or with CSS (if possible) I would like to get only the skills without the ", ".

So if I have the skills like: Photographer, Designer

I need to separate those skills and store each skill in an JavaScript array.

You can use the jQuery `replace` function. Similar http://stackoverflow.com/questions/7842875/removing-comma-for-value-with-javascript — PiLHA, Jul 02 '13 at 12:33
I love the fact that your profile says that you are a web developer (MS specialist) but you haven't even heard of a split function. I mean come on, if you really know PHP, C, C++ you would have thought about searching for the equivalent split function in JS! — Dany Khalife, Jul 02 '13 at 12:34
@DanyKhalife I love the fact that you read his profile but didn't notice his age ;-) Considering his tender age, I would ignore all the skills I read on that profile. — Atif, Jul 02 '13 at 20:42
well young or not, if he had the time to fill in his profile he also had the time to do a bit of searching before posting, if not on SO maybe on google there are LOTS of web tutorials out there it only takes 1 word for him to type... — Dany Khalife, Jul 03 '13 at 00:08

score 6 · Accepted Answer · answered Jul 02 '13 at 12:31

6

Given this markup

<span id="skills">Skill1, Skill2, Skill3</span>

You could use the split() method

$('#skills').text().split(', ');  // ["Skill1", "Skill2", "Skill3"]

answered Jul 02 '13 at 12:31

Fabrizio Calderan

120,726
26
164
177

score 3 · Answer 2 · answered Jul 02 '13 at 12:31

3

use the Javascript function split

var str = $("span").text();
var results = str.split(", ");

http://www.w3schools.com/jsref/jsref_split.asp

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split

answered Jul 02 '13 at 12:31

michaelward82

4,706
26
40

Get ready to be slated for referencing w3schools, by people that never back up their argument. – Reinstate Monica Cellio Jul 02 '13 at 12:34
Thanks @FabrizioCalderan - I'll have a read :) – Reinstate Monica Cellio Jul 02 '13 at 12:38
use the Javascript function, but you use the $ from Jquery instead of document.getElementByXXX depending on the need. – Slayner Feb 02 '16 at 14:08

Atif · Answer 3 · 2013-07-02T20:25:42.140

0

If you need to remove spaces as well then

"Photographer, Designer, Wedding Planners".split(',').map(function(){return arguments[0].replace(/^(\s)*/g, '')});

or else you can simply use

"Photographer, Designer".split(',');

edited Jul 02 '13 at 20:25

answered Jul 02 '13 at 12:32

Atif

10,623
20
63
96

The problem with removing spaces first is that you remove spaces in between skills, like "Wedding Planning". You probably don't want that. – Steve Jul 02 '13 at 12:43
Yeah, I thought of that before posting the answer. Updated it now – Atif Jul 02 '13 at 20:19

score 0 · Answer 4 · answered Jul 02 '13 at 12:35

0

Use split :

http://www.w3schools.com/jsref/jsref_split.asp

var skill = "Photgrapher, Designer";
var skillArray = skill.split(", ");
console.log(skillArray); // output ["Photographer", "Designer"]

answered Jul 02 '13 at 12:35

isThisLove

269
2
4

score 0 · Answer 5 · answered Jul 02 '13 at 12:36

0

user javascript split function it will return a array

Code like this :

<span>Photographer, Designer</span>

var str = $("span").text();
var results = str.split(", ");

you can use this as results[0] , results[1]

I Hope it will help.

answered Jul 02 '13 at 12:36

Sonu Sindhu

1,752
15
25

Breaking the span's text by ", "

5 Answers5