jQuery Script src declaration throws JavaScript error despite NoConflict being called

Question

I'm using a survey designing program that gives (some) freedom when programming your own custom functions/design/etc. By default, it uses Prototype. I want to use jQuery as well. In the header I declare jQuery and call noConflict, like so:

<script src="SurveyResource/jquery.js"> </script>
<script>
jQuery.noConflict();
</script>

When I try to load the page, I get the classic "Object doesn't support this property or method" error. I also tried removing the noConflict script, and the error still occurs with just the declaration. After a quick debug, I found that the error occurs in prototype.js, at this function:

fire: function(element, eventName, memo) {
  element = $(element);
  if (element == document && document.createEvent && !element.dispatchEvent)
    element = document.documentElement;

  var event;
  if (document.createEvent) {
    event = document.createEvent("HTMLEvents");
    event.initEvent("dataavailable", true, true);
  } else {
    event = document.createEventObject();
    event.eventType = "ondataavailable";
  }

  event.eventName = eventName;
  event.memo = memo || { };

  if (document.createEvent) {
    element.dispatchEvent(event);
  } else {
    element.fireEvent(event.eventType, event);
  }

  return Event.extend(event);
}

Specifically, at this line: element.fireEvent(event.eventType, event);. Also, I'm using IE8. Sorry about that. Can anybody help me to get these two kids to play nice together? The related questions don't seem to have any answers.

EDIT: here's a fiddle of what I think is a reproduction of my problem: http://jsfiddle.net/vbzju/7/

Prototype is selected as the framework (that's what the survey software uses), but then I add jQuery as a header script, call noConflict, and then try a simple jQuery function. I think the error thrown is the same as the error I'm getting on my machine.

Answer 1

In your fiddle, jquery was being loaded twice. Here is an example of using a closure so that you can use the $ sign for both jquery and prototype. http://jsfiddle.net/vbzju/14/ Also, you should load jquery first and then prototype.