Flot: chart showing in preview, not in published post

Hi,

I’ve been trying to include a chart in a post. I use a snippet to reference jQuery and Flot and to insert JS code into the post. Chart shows and works fine in preview, but as soon as I publish it, it doesn’t work anymore.
I researched and found the usual workaround with

jQuery(document).ready(function($) {
code
}

which works fine in preview, but not in published post again. I also tried with a closure, but it doesn’t work either.

My function looks like that:

jQuery(document).ready(function($) {
	var datasets = {
        "aaa": {
	label: "aaa",
	data: [[1262357714238, 0.057287587], [1265036114239, 0.055367078], [1267455314239, 0.054180776], [1270130114239, 0.05457265], [1272722114239, 0.054410966], [1275400514239, 0.049508402], [1277992514239, 0.037043157], [1280670914239, 0.040816327], [1283349314239, 0.04204891], [1285941314239, 0.043766468], [1288623314239, 0.048476799], [1291215314240, 0.052294171], [1293893714240, 0.05075277], [1296572114240, 0.052747609], [1298991314240, 0.043661037], [1301666114240, 0.049346662], [1304258114240, 0.037790959], [1306936514240, 0.027700093], [1309528514240, 0.036124521], [1312206914240, 0.034213395], [1314885314240, 0.048664626], [1317477314240, 0.040429237], [1320159314240, 0.043953031], [1322751314240, 0.053418513], [1325429714240, 0.050313224], [1328108114240, 0.049021596], [1330613714240, 0.0447459], [1333288514240, 0.049282184], [1335880514240, 0.052797518], [1338558914240, 0.048916804], [1341150914241, 0.044565217], [1343829314241, 0.037587731], [1346507714241, 0.039529283], [1349099714241, 0.033933138], [1351781714241, 0.039723952], [1354373714241, 0.035645174], [1357052114241, 0.038310974], [1359730514241, 0.045379363], [1362149714241, 0.033955163]]
}};

var i = 0;
$.each(datasets, function(key, val) {
 val.color = i;
 ++i;
});

var choiceContainer = $("#choices");
	$.each(datasets, function(key, val) {
		choiceContainer.append("<div class= 'checkbox1'><input type='checkbox';  name='" + key +
				"'  id='id" + key + "'></input>" +
				"<label for='id" + key + "'>"
				+ val.label + " </label></div> ");

});
		choiceContainer.find("input").click(plotAccordingToChoices);

function plotAccordingToChoices() {
  var data = [];
  choiceContainer.find("input:checked").each(function () {
	var key = $(this).attr("name");
	if (key && datasets[key]) {
		data.push(datasets[key]);
	}
});

if (data.length > 0) {
	$.plot($("#placeholder"), data, {
		yaxis: {
			min: 0
			},
		xaxis: {
			mode: "time",
			},
		});
}
}

plotAccordingToChoices();
});

In web console I see a message “TypeError: $.plot is not a function”. Before that it was “TypeError: $ is not a function”.

What do I have to do to see the chart in published post?
Thanks very much for help!

Best,

Marko

http://wordpress.org/extend/plugins/flot/