Turbo Frames Issue with jQuery Append-CodePudding

Turbo frames are causing the jQuery script to not run if I navigate between tabs or pages. Below is my code. Any ideas on a workaround so the script continues to run even after the page url changes?

$(document).ready(function() {
  $('#test').append('<div>Sample Text</div>');
});

I was able to modify the script with the following from the answer below and included additional code so it would load on the initial page load as well. Not sure if it's the correct way to do it, but it works. See below.

$(document).ready(function() {
  $('#test').append('<div>Sample Text</div>');
});

$(document).on("turbo:frame-load", function() {
  $('#test').append('<div>Sample Text</div>');
});

CodePudding user response：

According to the docs, there are events that you could in theory attach to.

https://turbo.hotwired.dev/reference/events

$.loadContent = function() {
  $('#test').append('<div>Sample Text</div>');
}

$(document).ready(function() {
  $.loadContent();

  $(document).on("turbo:frame-render", function() {
    $.loadContent();
  });
});