Why bind and unbind don't work as expected
<p>I was originally doing this:</p>

<pre><code>$('div.ocontainer').each(function() {
    var o = $(this);
    var newCode = $(this).attr('id');
    if (o.parents('.ocontainer').length != 0) {
        var oldCode = o.parents('.ocontainer').attr('id');
        console.log('unbinding '+oldCode);
        $('#'+oldCode+' a').each(function() {
            $(this).unbind('click')
            })
    }
    console.log('binding '+newCode);
    $('#'+newCode+' a').each(function() {
        $(this).click(function() {
            decideStMethod(newCode);
        })
    })
})
</code></pre>

<p>...but the <code>unbind</code> was not working. I ended up with the original code being passed in the click function. So I changed to using name spaced events:</p>

<pre><code>$('div.ocontainer').each(function() {
    var o = $(this);
    var newCode = $(this).attr('id');
    if (o.parents('.ocontainer').length != 0) {
        var oldCode = o.parents('.ocontainer').attr('id');
        console.log('unbinding '+oldCode);
        $('#'+oldCode+' a').each(function() {
            $(this).unbind('click.'+oldCode)
            })
    }
    console.log('binding click.'+newCode);
    $('#'+newCode+' a').each(function() {
        $(this).bind('click.'+newCode,function() {
            decideStMethod(newCode);
        })
    })
})
</code></pre>

<p>...and now the <code>unbind</code> works but the subsequent <code>bind</code> does not. Note, though, that the line that is doing the <code>bind</code> DOES work if it's not subsequent, that is, if it is not preceded by an <code>unbind</code>.</p>

<p>The use of this is that first a region of the page is processed, and the binding is done on the links within it. Then, the subregions are processed, and if one of them has its own code, the region's handler must be unbound and replaced with the subregion's. The reason for all of this is that the subregions are placed in the region dynamically, so what they will be is never known in advance. Oh, and just in case it matters, this is jQuery 1.72</p>

<p>So:</p>

<pre><code>&lt;div id="region" class="ocontainer"&gt;
   &lt;div id="subregion" class="ocontainer"&gt;
      &lt;a&gt;
</code></pre>

<p>On the processing of region, the link is bound to click.region and a function passing 'region'. Then, click.region should be unbound, which it is, and click.subregion bound in its place with a function passing 'subregion', which does not happen.</p>
