Elevatezoom Not Working in Magento 1.9.1.0 – Troubleshooting Guide

Found the solution!

I originally tried @AreDubya's solution by making a custom .js file with jQuery.noConflict();

and making sure to include it in my local.xml with

<catalog_product_view>
    <reference name="head">
        <action method="addItem"><type>skin_js</type><script>js/lib/elevatezoom/jquery.elevateZoom-3.0.8.min.js</script></action>
        <action method="addItem"><type>skin_js</type><script>js/mynoconflict.js</script></action>
    </reference>
</catalog_product_view>

Viewing Sources in Chrome's Developer Console showed my custom JS file being loaded immediately after jquery.elevateZoom-3.0.8.min.js

Looking through Chrome I stumbled upon a noconflict.js that magento includes after it loads protoype and jquery, I copied its syntax into my mynoconflict.js and it worked!

The Solution

// Avoid PrototypeJS conflicts, assign jQuery to $j instead of $
var $j = jQuery.noConflict();

Thanks for the help guys!

Open your styles.css and apply the following style

@media (max-width: 770px)
{
  .product-collateral > dl > dd {
    display: block !important;
  }
}