Zabezpieczenie przed XSS

Przy zabezpieczaniu strony przed atakami napotkałem jeszcze jeden problem związany z XSS, ale od strony JS, a konkretniej jQuery.

Chodzi o to, że do selectów dynamicznych pobieram dane z bazy danych. I dajmy na to w bazie znajdzie się wartość:

<script type="text/javascript">
alert("Uwaga!");
</script>

I teraz dodaje dynamicznie wartości z selectów funkcją after() w jQuery. Po dodaniu tych wartości do strony wstrzykuje się kod JS, który automatycznie pokazuje alert o treści Uwaga!. W PHP tak jak kolega wyżej podał wystarczyło htmlspecialchars, natomiast jak przefiltrować zmienne w JS?
Poszukałem troszkę w google i znalazłem stronę:

http://javascript-ajax.pl/2009/12/01/html-special-chars-encode-decode-javascript/

ale nie bardzo wydaje mi się, że to coś da.

Jakie są wasze opinie? Może macie jakieś pomysły jak takie coś zrobić, lub wykorzystać skrypt z powyżej podanej strony?

A jak dodajesz te dane do strony? Użyj .text(daneZajaxa) zamiast .html(daneZajaxa).

Dodaje je tak:

$('a.add').click(function() 
    {
		var category = $("#category option:selected").text();
		var sub_category = $("#sub_category option:selected").text();
		var sub_sub_category = $("#sub_sub_category option:selected").text();
		var ilosc = $("#ilosc option:selected").text();
        $(this).after('<div id="htmlspecialcharsInput"><label><br /><br /><strong>Rodzaj:</strong> '+category+' - <strong>Produkt:</strong> '+sub_category+' - <strong>Kolor:</strong> '+sub_sub_category+' - <strong>Ilość:</strong> '+ilosc+' <a href="#del" class="del">X</a><input type="hidden" name="cat[]" value="<strong>Rodzaj:</strong> '+category+' - <strong>Produkt:</strong> '+sub_category+' - <strong>Kolor:</strong> '+sub_sub_category+' - <strong>Ilość:</strong> '+ilosc+' "/></label></div>');
		return false;
    });

Rozwiązań jest wiele. Od zamiany < na < i > na > aż po takie:

var text = document.createTextNode(daneZbazy);
$(this).after('<div ...>' + text + '... </div>');