Is it possible to insert in-line javascript code into another javascript/jquery code?

Question

This question looks a little dumb... but I am wondering if is it possible to insert in-line javascript code into another javascript code. Lets put this clear:

I'm trying to put a google plus button, appending it through jquery as follows:

jQuery('.gplus').append('<g:plusone annotation="inline"></g:plusone>');

This button needs external js in order to work properly. What i'm trying to do is insert the external js doing this:

var gplusjs = '
<script type="text/javascript">
  (function() {var po = document.createElement("script");
    po.type = "text/javascript"; po.async = true;
    po.src = "https://apis.google.com/js/plusone.js";
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(po, s);
  })();
</script>';
jQuery('#js').append(gplusjs);

The result of this is the code printed as HTML, but not interpreted as a script. This is possible? I am a dumbass? Thanks!

Answer 1

You should just execute that code normally:

var po = document.createElement("script");
po.type = "text/javascript"; po.async = true;
po.src = "https://apis.google.com/js/plusone.js";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(po, s);

Or, even easier:

$.getScript("https://apis.google.com/js/plusone.js");

Answer 2

That's because jQuery append and scripts don't work. Do it the old fashioned way

var gplusjs = '(function() {var po = document.createElement("script");po.type = "text/javascript"; po.async = true;po.src = "https://apis.google.com/js/plusone.js";var s = document.getElementsByTagName("script")[0];s.parentNode.insertBefore(po, s);})();';
var script = document.createElement("script");
script.textContent = gplusjs;
document.head.appendChild(script);

Also note that multi line string literals don't exist in JS.