Modal dialog reacts when clicking anywhere; not just on button

Question

Here's my pastebin: http://pastebin.com/UrFVfg5u

This is stripped down basic code that I'm running inside the Mura CMS; it has the same problem here, so I know it's not Mura.

You click a link and a modal "window" comes up. You punch in details, e.g. zipcode, and click Find Consultants. It goes out and does it's ajax thing and comes back with a list of them. That works great.

There's a New Search button that you're supposed to click to do the search again. That works too. The problem is that ANYWHERE you click, including the New Search button, sends you back to the search page. I don't get it. The only way to stop this is to disable the .delegate for the .newSearch class (I tried it as an ID too; same result), which of course means there's no way to do a new search.

In addition, the "Close" button gets acted on if you click outside of it as well.

The code sample has no CSS other than a few tidbits inline, yet still does it. My best guess at this point is maybe a layout problem? I can't find it though. Thanks for your help!

Answer 1

Partially solved..

I changed the #results div to be this:

<div id="results" style="display:none">

    <div id="resultContent"></div>

    <div class="create-account"><p class="pull-right"><input type="button" class="btn btn-lg btn-primary newSearch" value="New Search"></p></div>

</div>

Which means I commented out the last line down in renderData() to eliminate the creation of the New Search button there. I also changed the jQuery.root.delegate('.newSearch') to just good ole $('.newSearch).

I hope that makes sense.