Skip to content

Instantly share code, notes, and snippets.

Created February 23, 2015 00:23
What would you like to do?
(function ($) {
$.fn.footnote = function (options) {
// This is the easiest way to have default options.
var settings = $.extend({
// These are the defaults.
color: "blue",
referencesLocation: "#references"
}, options);
var footnotes = this.find("span.footnote");
footnotes.each(function (key, value) {
//console.log("footnote" + key + " : " + $(value).contents().text());
var footnoteContentsNode = $(value).clone();
var footnoteNumberTextNode = document.createTextNode("[" + key + "] ");
// The default value for referencesLocation gets overridden by $.extend().
.css("color", settings.color).append("<br />");
// The default value for color gets overridden by $.extend().
$(value).text("[" + key + "] ").css("color", settings.color)
.css("vertical-align", "super");
return footnotes;
<!DOCTYPE html>
<p id="myParagraph">
In up so discovery my middleton eagerness dejection explained. Estimating excellence ye contrasted
insensible as. Oh up unsatiable <span class="footnote">Unpacked reserved sir.</span> interested.
Present suppose in esteems indemesne colonel it to. End horrible she landlord screened stanhill.
Repeated offended <span class="footnote">you opinions off</span> dissuade ask packages screened.
She alteration everything sympathize impossible his get compliment. Collected few extremity
suffering met had sportsman.
<div id="references"></div>
<div id="theReferences"></div>
<script src="Scripts/jquery-2.1.3.js"></script>
<script src="Scripts/footnoter/jquery-footnoter-0.0.3.js"></script>
color: "orange",
referencesLocation: "#theReferences"
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment