title: Knockout.js: Using a jquery widget with knockout bindings inside HTML that is already knockout bound
body: <p>I have a section of my page that is using knockout for the UI and calls ApplyBindings on that section aka:</p>
  <h3>HTML</h3>
  <pre><code>&lt;div id=&quot;example&quot;&gt;
      &lt;p data-bind=&quot;text: message&quot;/&gt;
      &lt;i class=&quot;icon-information&quot; title=&quot;some tooltip here&quot;/&gt;
  &lt;/div&gt;
  </code></pre>
  <h3>JS</h3>
  <pre><code>var model = createModel();
  ko.applyBindings(model, $(&quot;#example&quot;)[0]);
  </code></pre>
  <p>and I have a widget that was created that also uses Knockout under the covers that I'd like to hook up to the <code>i</code> tag to get a nice tooltip. The problem is that because applyBindings basically gets called twice on the <code>i</code> tag there are errors. I understand that in the contrived example I could just move the <code>i</code> tag out of where my bindings are but in the real code this is simple not possible.</p>
  <p>My question is how are people handling these types of situations? THe easiest answer is to change the widget to not use Knockout but that sucks and is a lot of extra code.</p>
  <h3>Please Don't focus solely on the demo code above. This is more of a theoretical example. Trying to use the real example would take too much explaining.</h3>