Inserting HTML inside quotes

Question

I want a page break inside the title attribute of a link, but when I put one in, it appears correct in a browser, but returns 7 errors when I validate it.

This is the code.

<a href="images/Bosses/Lord Yarkan Large.jpg" class="hastipz" target="_blank" title="Lord Yarkan, a level 80 Unique from Silkroad Online -- Click for a Larger Image">
<img class="bosspic" src="images/Bosses/Lord Yarkan.jpg" style="float:right; position:relative;" alt="Lord Yarkon; Silkroad Unique"/>
</a>

The reason is because the title attribute appears in a tooltip, and I need a page break inside that tooltip. How can I add a page break inside the quotes without returning errors?

Answer 1

Do you need to validate for work?

If not, do not worry about the errors if it works as you want it.

Validation is not the goal. It is a tool to help build better Web sites. which is the goal. ;-)

If you must have it validate, you could try to use some script to switch out a specific keyword / set of characters for a <br /> at dom ready. Although this is untested and I am not sure it wouldn't throw errors, too.

EDIT

As requested, a little jQuery to switch out a word:

$('a').each(function(){
    var a = $(this).attr('title');
    var b = a.replace('lineBreak','\n');
    $(this).attr('title', b);
});

Example: http://jsfiddle.net/jasongennaro/qRQaq/1/

Nb:

1. I used "lineBreak" as the keyword, as this is unlikely to be matched. "br" might be
2. I replaced it with the \n line break character.
3. You should try the \n line break character on its own... might work without needing to replace anything.