parameter not being passed in javascript plugin, html syntax issue?

Question

I'm using a plugin called Prettyphoto, when you initiate the plugin you can pass a parameter called social_tools where you can enter in html that loads Twitter and Facebook buttons.

The default html in the js file itself works no problem, I can also add in html into the js file and it works.

But when I try and add the code where I initiate the plugin it stops working.

All I end up seeing is }); }); outputted on the screen, as if something is not closing correctly somewhere.

Im working locally.

Here is my code

 <script type="text/javascript" charset="utf-8">
 $(document).ready(function(pp_settings){
 $("a[rel^='prettyPhoto']").prettyPhoto({
        social_tools: '<div class="twitter"><a href="http://twitter.com/share" class="twitter-share-button" data-count="none">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div><div class="facebook"><iframe src="//www.facebook.com/plugins/like.php?locale=en_US&href={location_href}&amp;layout=button_count&amp;show_faces=true&amp;width=500&amp;action=like&amp;font&amp;colorscheme=light&amp;height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:500px; height:23px;" allowTransparency="true"></iframe></div>' 
                });
 });

 </script>

Here you can see the list of parameters, if you scroll down to customization, at the end you will social_tools

http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation

Thanks

Answer 1

The <script> element actually ends at the 1st use of </script>, despite its placement or usage inside a String literal.

A common trick to prevent this is to break it up:

'...</' + 'script>...'

Answer 2

Does this also not work?

    var options = {social_tools: '<div class="twitter"><a href="http://twitter.com/share" class="twitter-share-button" data-count="none">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div><div class="facebook"><iframe src="//www.facebook.com/plugins/like.php?locale=en_US&href={location_href}&amp;layout=button_count&amp;show_faces=true&amp;width=500&amp;action=like&amp;font&amp;colorscheme=light&amp;height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:500px; height:23px;" allowTransparency="true"></iframe></div>'};

$(document).ready(function(pp_settings){
     $("a[rel^='prettyPhoto']").prettyPhoto(options);
});