Поиск JQuery на статической HTML-странице с выделением найденного слова

Я пытался выполнить простой поиск внутри статической HTML-страницы с помощью JQuery. Я должен упомянуть, что я впервые работаю с JQuery.

Я пытаюсь изменить фон найденного слова на странице, и вот что я пробовал до сих пор:

myJavascript.js:

$(document).ready(function(){

     $('#searchfor').keyup(function(){
         page = $('#all_text').text();
         searchedText = $('#searchfor').val();
         $("p:contains('"+searchedText+"')").css("color", "white");
    });
});

Вот также HTML-код:

страница .html:

<html>
<head>
    <title>Test page</title>
</head>
<body bgcolor="#55c066">
<input type="text" id="searchfor"></input>
    <p id="all_text">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euism modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
    <font color="red">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tinci futurum.</font>
    </p>
</body>
    <script src="jquery-1.7.2.min.js"></script>
    <script src="myJavascript.js"></script>
</html>

После проверки страницы с помощью Firebug я вижу, что переменные в JQuery действительно получают значение из поля ввода, но я думаю, что я испортил часть выделения.

Заранее спасибо за помощь!

19
задан Radu Gheorghiu 4 April 2012 в 13:00
поделиться