Path: csiph.com!newsfeed.hal-mli.net!feeder3.hal-mli.net!newsfeed.hal-mli.net!feeder1.hal-mli.net!npeer01.iad.highwinds-media.com!news.highwinds-media.com!feed-me.highwinds-media.com!postnews.google.com!glegroupsg2000goo.googlegroups.com!not-for-mail
From: hiteshtr <hiteshtr@gmail.com>
Newsgroups: comp.lang.javascript
Subject: highlight dynamically generated text using javascript
Date: Fri, 30 Mar 2012 22:56:19 -0700 (PDT)
Organization: http://groups.google.com
Lines: 38
Message-ID: <6327659.9.1333173379365.JavaMail.geo-discussion-forums@pbbpr1>
NNTP-Posting-Host: 117.211.84.218
Mime-Version: 1.0
Content-Type: text/plain; charset=ISO-8859-1
Content-Transfer-Encoding: quoted-printable
X-Trace: posting.google.com 1333173380 29829 127.0.0.1 (31 Mar 2012 05:56:20 GMT)
X-Complaints-To: groups-abuse@google.com
NNTP-Posting-Date: Sat, 31 Mar 2012 05:56:20 +0000 (UTC)
Complaints-To: groups-abuse@google.com
Injection-Info: glegroupsg2000goo.googlegroups.com; posting-host=117.211.84.218; posting-account=hONuwgoAAACbT20CCYHzgrZxbA97dv_K
User-Agent: G2/1.0
X-Received-Bytes: 2678
Xref: csiph.com comp.lang.javascript:13163

I am creating a page to show pdf and I used pdf.js project of Mozilla to re=
nder pdf.

pdf.js is making multiple dynamic divs of rendered text under canvas tag. I=
 want to highlight some text of my pdf. Following is the code generated dyn=
amically by pdf.js:

<div id=3D"viewer">

<div id=3D"pageContainer1" class=3D"page" style=3D"width: 741.8181818181818=
px; height: 959.9999999999999px; " data-loaded=3D"true">
<canvas id=3D"page1" width=3D"741" height=3D"959"></canvas>
<div class=3D"textLayer">
<div data-canvas-width=3D"300.69542660606743" data-font-name=3D"Times" styl=
e=3D"font-size:12.06334818181817px; left: 173.1905882352941px; top: 8.59389=
9292929294px; -webkit-transform: scale(0.9002857084013994, 1); -webkit-tran=
sform-origin-x: 0%; -webkit-transform-origin-y: 0%; " dir=3D"ltr" data-text=
-length=3D"58">Boston&nbsp;University&nbsp;Computer&nbsp;Science&nbsp;Techn=
ical&nbsp;Report&nbsp;No.&nbsp;20</div>
</div>
</div>

<div id=3D"pageContainer2" class=3D"page" style=3D"width: 741.8181818181818=
px; height: 959.9999999999999px; " data-loaded=3D"true">
<canvas id=3D"page1" width=3D"741" height=3D"959"></canvas>
<div class=3D"textLayer">
<div data-canvas-width=3D"300.69542660606743" data-font-name=3D"Times" styl=
e=3D"font-size:12.06334818181817px; left: 173.1905882352941px; top: 8.59389=
9292929294px; -webkit-transform: scale(0.9002857084013994, 1); -webkit-tran=
sform-origin-x: 0%; -webkit-transform-origin-y: 0%; " dir=3D"ltr" data-text=
-length=3D"58">Boston&nbsp;University&nbsp;Computer&nbsp;Science&nbsp;Techn=
ical&nbsp;Report&nbsp;No.&nbsp;20</div>
</div>
</div>

</div>

i only want to highlight the text of pageContainer1's text layer