Dynamically Inserting <script> tags into HTML on Page Load

I’m trying to dynamically insert the Tweetmeme button using Javascript. I’m currently using jQuery throughout the site. Here’s the script that I’m using. I basically want to cycle through all the blog entries with a class of journal-entry and append the following JavaScript to the end. This Javascript comes straight from tweetmeme.com. This doesn’t work for me though and it has something to do with the code between append(). It doesn’t like the second set of script tags.

<script type="text/javascript"> 
$(document).ready(function() {

$('.journal-entry').each(function(index) {
    $(this).append('<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>');
   });

});
</script>

Any help is appreciated. Thanks.

Try to escape the backslash in the script closing tag:

use getScript… http://api.jquery.com/jQuery.getScript/
Also you should only load a script once…ie. remove it from the each iteration.



$.getScript( "tweetme.js",
  function () {
    $( ".some-selector" )
      .each(
        function () {
          // Do what ever tweetme does...
        }
      );
  }
);