In laravel blade file javascript stops working after some time when i add new line of code

Question

first of all iam new to javascript iam facing this problem from 3 weeks and try to debug it but didnt find any solution so problem is when i write a fresh piece of js code inside my blade file it works fine for 5-10 mins after that no response and console doesn't even show any js error in it

i also used following commands php artisan cache:clear php artisan view:clear nothing happens then i created new laravel project its version was 5.8 and try to do same in it but it works fine in it but not in my old project then i upgrade its version same issue then i shifted all my files from old project to newly created project then javascript is working fine and after some time same issue starts then i realize adding new piece of code in my code makes code not work when i remove the new line of code it works fine i dont know why it is doing this in below given code when i add var info = {!! json_encode($pdata->toArray()) !!}; var info = {!! json_encode($pdata->toArray()) !!}; it works for some time fine then whole js code stops working and then i remove this line code starts to work again

   <script>
    var button=document.getElementById('claps');
    var not_span=document.getElementById('notifications');
    var not_butn=document.getElementById("notification-btn" );
    var message=document.getElementById('message');
    var trash =document.getElementById('trash');
    var info = {!! json_encode($pdata->toArray()) !!};
    var jsoninf=JSON.stringfy(info);
    count1=0;
    count2=0; 
    button.onclick=function()
    {
      count1=count1+1;
      button.innerHTML=count1;

    //   not_span.innerHTML="*"+count1;

      message.innerHTML=jsoninf + " Claped on your post";
    }

    button.onmouseover=function()
    {
      button.innerHTML=count1;
    }
    button.onmouseout=function()
    {
      button.innerHTML='<img src="https://img.icons8.com/color/30/000000/applause.png">'+'Claps';
    }
    not_butn.onclick=function()
    {
      not_span.style.display='none';
    }
    trash.onclick=function()
    {
      count2=count2+1;

      trash.innerHTML=count2;

       //not_span.innerHTML=count2;

      message.innerHTML="Abubakar" + "Trashed you post";
    }
    trash.onmouseover=function ()
    {
      trash.innerHTML=count2;
    }

    trash.onmouseout=function ()
    {
      trash.innerHTML='<img src="https://img.icons8.com/color/30/000000/delete.png">'+" Trash";
    }


  </script>

there is no error in my chrome console related to js code

Answer 1

This code will do in blade

var info = @json($pdata->toArray());
// var jsoninf=JSON.stringfy(info); // remove this

info variable will become javascript object/array. You don't need to parse it blade will do the work for you this way.