Recreate jQuery

Recreate jQuery

Hello,

I was wondering about the very first bit of jQuery code ever written. I figure it was possibly written inside a script tag as a start.

So I found an article:
http://blog.johnsedlak.com/2013/04/breaking-down-how-jquery-is-built/

And that also comes with a Fiddle:
http://jsfiddle.net/jsedlak/s5bC4/

But the problem is with the above Fiddle if you remove the jQuery link then $ becomes undefined.  So the question is how do you modify the Fiddle so that $ becomes ( you can't add the link back ) defined and then build a method so that .addClass2 functions with this minimal script code. When I say remove the jQuery link I mean this link:

<script src="http://code.jquery.com/jquery-2.0.3.js" type="text/javascript"></script> 

Meaning if you have:

<p>blah</p>
<p>blah2</p>
<p>blah3</p>

and upon executing $('p').addClass2('test');

does update the DOM and looks like:

<p class="test" >blah</p>
<p class="test">blah2</p>
<p class="test">blah3</p>

The specific code I am working from is this to build upon or rewrite:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5.         <title>HTML</title>
  6.         <meta name="description" content="">
  7.         <meta name="author" content="Jim">
  8. <style type='text/css'>
  9. </style>
  10. </head>
  11. <body>
  12. <div id='log'>
  13. </div>
  14. <script type="text/javascript">
  15. (function (window, undefined) {
  16.     var
  17.         version = new Version(2, 0, 0, 0),
  18.         js = function (selector) {
  19.             return new js.fn.init(selector);
  20.         };
  21.     js.fn = js.prototype = {
  22.         version: version,
  23.         init: function (selector) {
  24.             this.$element = $(selector);
  25.             return this;
  26.         }
  27.     };
  28.     js.fn.init.prototype = js.fn;
  29.     window.js = js;
  30.     function Version(major, minor, build, revision) {
  31.         this.major = major;
  32.         this.minor = minor;
  33.         this.build = build;
  34.         this.revision = revision;
  35.         this.toString = function () {
  36.             return this.major.toString() + '.' + this.minor.toString() + '.' + this.build.toString() + '.' + this.revision.toString();
  37.         };
  38.     }
  39. })(window);
  40. //The author is showing how you can get version info, I am looking for addClass2
  41. //Furthermore his version info does not work unless you define the jQuery library.
  42. js('#Log').$element.append(js().version.toString() + '\r\n');
  43. </script>
  44. </body>
  45. </html>
So that means that this would also include:

  1. $.fn.addClass2 = function(){
  2. //Use this to build addClass2
  3. var currentjQueryObject = this; //work with currentObject return this;//you can include this if you would like to support chaining };



Thanks,
Jim