CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Spooks
Spooks

Reputation: 7177

Adding style to untagged text

I have html that I can't change (as its coming from a clients database) something like below. as you can see it is not wrapped in a tag, and I can't select the div, as I only want to target stuff under the sub_header (if it's present) with white-space:pre-line;

<span class="sub_header">Example:</span>
<br/>
Some text
That I need to wrap with white-space:pre-line;
As it displays on one line in html
all the way done to the div
</div>

Is this even possible?

Upvotes: 0

Views: 1019

Answers (3)

Jason P
Jason P

Reputation: 27012

Here's a jQuery solution: http://jsfiddle.net/9PzeS/

$($('.sub_header + br')[0].nextSibling).wrap('<span style="white-space:pre-line"></span>');

Not sure if it's ideal and needs some error handling, but it seems to work.

Edit - Slightly more readable version:

var textNode = $('.sub_header + br')[0].nextSibling;
$(textNode).wrap('<span style="white-space:pre-line"></span>');

$('.sub_header + br')[0] selects the br tag in your example and gets the dom node. nextSibling is a vanilla js property that selects the next sibling, including text nodes.

I then wrap that with a span with the correct style.

Upvotes: 0

Keith
Keith

Reputation: 4147

looking for something like this? http://jsfiddle.net/pKyG7/4/

<div>
    <span class="sub_header">Example:</span><br/>
<div style="font:arial; font-size:26px; white-space:pre-line;">Some text
That I need to wrap with white-space:pre-line;
As it displays on one line in html
    all the way done to the div.</div>
</div>

Upvotes: 0

Ennui
Ennui

Reputation: 10190

$('div.container').css('white-space', 'pre-line');
$('div.container span.sub_header').css('white-space', 'normal');

That code should apply the CSS to the parent div (which I assumed has a class of container but change it to whatever) but not the child span. There are more elegant ways to do it (get inner content, exclude the span, then wrap it in another div styled as you need) but this will do in a jiffy assuming they are all in this format.

Upvotes: 2

Related Questions