jQuery split only words that do not have specific class

Question

I have the following markup:

<div id ="selectable1">
<span id="layer6">
here are some words that needs to be splited
<span class="good">this should not be splitted<span>
this should be splitted
<span class="good">and this should not be spited<span>
</span>
</div>

I am trying to write a function that will split only the words that do not have class "good". I am using this:

var words = $("#selectable1 span.cica").text().split(" ");
var text = words.join("</span><span class='drag col'>  ");
$("#selectable1 span.cica").html("<span class='drag col'>" + text + "</span>");

...but this is splitting all my words and I need the "good" class not to be splitted and not to be added to the var text - join.

I hope that I had explained well what I want to do here, I know that this can be confussing.

Thanx for your help

Answer 1

Update based on comments. Since you'r wrapped in a span, the selector is going a bit crazy, do this instead:

var span = $("#selectable1>span.cica").clone();
span.find(".good").remove();
var words = span.text().split(" ");
var text = words.join("</span><span class='drag col'>  ");

Answer 2

var words = $("#selectable1 span:not(.good)").text().split(" ");
var text = words.join("</span><span class='drag col'>  ");

That might work...