How to get older jquery versions to access SVG element

Question

I'm stuck using jquery 1.11.3 on an application, but jquery 1.11.3 doesn't seem to want to access elements in an SVG. Is this possible. I can't figure out why not.

Using Jquery 1.11.3 - doesn't work ( update , now uses version 1.12.4 and it works)

http://codepen.io/omarel/pen/zNMJOJ

Using jquery 3.1 - works

http://codepen.io/omarel/pen/XpyBOq

UPDATE: Thanks to @Rikin I realized I could use version 1.12.4 which starts adding classnames to SVG's and luckily this version works with the application I'm working on.

JQUERY

 $( ".amenitylink" ).on( "click", function() {
  $('svg #lobby').toggleClass("highlight");
 });

HTML

 <div class="amenitylink">click me</div>

 <svg version="1.1" id="main" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 width="276px" height="210px" viewBox="0 0 276 210" style="enable-background:new 0 0 276 210;" xml:space="preserve">
<style type="text/css">
 <![CDATA[
.st0{fill:none;stroke:#FFFFFF;stroke-width:11;stroke-miterlimit:10;}
]]>
</style>
 <rect id="lobby" x="13" y="17" class="st0 " width="240" height="179"/>
 </svg>

CSS

 body {
 background-color:#000;
 color:#fff;
 }
.amenitylink {
cursor:pointer;
padding:10px;
border:1px solid white;
 }
 .highlight {
    fill:rgba(134, 117, 77, 0.4) !important;
}

Answer 1

As commented above v1.11.3 - It does target SVG element correctly but fails to add classname inside it. When I debugged it was showing something like this [object SVGsomething] highlight

SVG element class addition was resolved in ~1.12.4 library and you can use that to get your issue resolve.