Q:

why my js variable not finding the php variable properly

I am reading a text file . and then splitting it into by 100 words in an array named "$arrpg"  and then in my js code while i am loading it to js variable , the var is unable to get the array values properly.  if you don't mind please see  a link where i uploaded it for test purpose (link) 
here my input text file is "  

A MUSICISTA E O GUERREIRO
  À noite, deitado, no escuro, não tenho forças para evitar o concerto da virtuose muriçoca. Ela vem dali até aqui na velocidade do som. Procuro capturá-la com a mão, ela -- vivace -- ...........................so many more

"
my js code is
    <script type="text/javascript" charset="UTF-8">

$(document).ready(function() {

    var ind=0;
   var tempv1;
   var tempv2;

    var pages=<?php echo json_encode((int)($page_num));?>;

    var jsarr= <?php echo json_encode($arrpg); ?>;

    var wmap=<?php 

    echo json_encode($word_map); ?>;
    var myurl=<?php echo json_encode($my_link.'write_comment/'.$file_name.'/'.$total_word.'/');?>

     $('.more').each(function() {

        pages++;

           $(this).html(jsarr[ind]);

        tempv2= ' <a class="link2" href="'+myurl+wmap[0]  + '">';

        if(pages!==1)
        {

            tempv1='<span>.... <a href=""class="link1">Read more</a></span>';
            tempv2='<br><br>'+tempv2+'Stop reading</a>';
            $('div.link1').html(tempv1);
            $('div.link2').html(tempv2);

        }
        else
        {

            tempv2='<br><br>'+tempv2+'Please a feedback</a>';

            $('div.link2').html(tempv2);

        }

            scroll();

        });   

    $(".link1").click(function(){

        ind++;

        $('div.more').append(jsarr[ind]);

        tempv2= '<a class="link2" href="'+myurl+wmap[ind]  + '">';

        if(ind<(pages-1) )
        {
            tempv1='<span>.... <a href=""class="link1">Read more</a></span>';
            tempv2='<br><br>'+tempv2+'Stop reading</a>';

            $('div.link1').html(tempv1);
            $('div.link2').html(tempv2);

        }
        else 
        {
            tempv2='<br><br>'+tempv2+'Please a feedback</a>';

            tempv1='';
            $('div.link1').html(tempv1);

            $('div.link2').html(tempv2);

        }

        scroll();

        return false;
    });
});

            function scroll(){
  $('html, body').animate({
    scrollTop: $("#ft").offset().top
  }, 0);
}

</script>

in this code declaration of jsarr can't get the values properly. seeing the link u will realize more. please help.
after 1st edit
`<script type="text/javascript" charset="UTF-8">

$(document).ready(function() {

    var ind=0;
   var tempv1;
   var tempv2;

    var pages=5;

    var jsarr= [" A MUSICISTA E O GUERREIRO\r\n"," a m"," agudo violino. Cubro a\\norelha, sinto calor, descubro a orelha, escuto a muri"," da habilidosa\\ninstrumentista. Na manh"," palmas de\\nminhas m"," morta, rubronegra\\n-- na plan"];
    alert(jsarr);

    var wmap=[30,60,90,120,150,175];
    var myurl="http:\/\/leiame.patio.com.br\/read\/write_comment\/muricoca\/175\/"  

     $('.more').each(function() {

        pages++;

           $(this).html(jsarr[0]);

        tempv2= ' <a class="link2" href="'+myurl+wmap[0]  + '">';

        if(pages!==1)
        {

            tempv1='<span>.... <a href=""class="link1">Read more</a></span>';
            tempv2='<br><br>'+tempv2+'Stop reading</a>';
            $('div.link1').html(tempv1);
            $('div.link2').html(tempv2);

        }
        else
        {

            tempv2='<br><br>'+tempv2+'Please a feedback</a>';

            $('div.link2').html(tempv2);

        }

            scroll();

        });   

    $(".link1").click(function(){

        ind++;

        $('div.more').append(jsarr[ind]);

        tempv2= '<a class="link2" href="'+myurl+wmap[ind]  + '">';

        if(ind<(pages-1) )
        {
            tempv1='<span>.... <a href=""class="link1">Read more</a></span>';
            tempv2='<br><br>'+tempv2+'Stop reading</a>';

            $('div.link1').html(tempv1);
            $('div.link2').html(tempv2);

        }
        else 
        {
            tempv2='<br><br>'+tempv2+'Please a feedback</a>';

            tempv1='';
            $('div.link1').html(tempv1);

            $('div.link2').html(tempv2);

        }

        scroll();

        return false;
    });
});

            function scroll(){
  $('html, body').animate({
    scrollTop: $("#ft").offset().top
  }, 0);
}

</script>`

A:

json_encode has some trouble with non utf8 chars.
the string parsing within json encode is then  stopped at the first non utf8 char found. 
so i would suggest:
utf8_encode each value in $arrpg before submitting to json_encode.

