Question

I’m trying to inject some Javascript code into a webpage using Greasemonkey. First I will start with what works.

var script = document.createElement( 'script' );
script.src = "http://code.jquery.com/jquery.min.js";
$("#navHome").append( script );

var buttonCode ='<input type="button" value="Make public" onclick="var selector=\'div.timelineTimestamp\'; $(selector).each(function() { var textToAppend=\' <input type=\\\'button\\\' value=\\\'Make Public\\\' > \'; $(this).append(textToAppend) });">'


$("#navHome").append(buttonCode);

I’m trying to change the line for the buttonCode so that when the button is pressed an alert is displayed. But to insert an alert message requires me to go one more level down in quotes, and I can’t find a way to make it work.

The closes I can get to it working is by inserting the following

onclick=\\\'alert(\\\\\'hi\\\\\')\\\' 

but that still doesn’t work. How can this be done?

Answer 1

You should try building your elements using jQuery instead, like this:

$("#navHome").append($("<script />").attr("src", "http://code.jquery.com/jquery.min.js"));

var buttonCallback = function() {
    // your callback code goes here...
};

$("#navHome").append($("<input />").attr("type", "button").val("Make public").bind("click", buttonCallback));