How to hide some markup that was added with .after()?
<p>In a nav bar I am working with, there is an arrow added to the "Active" item with jquery:</p>

<pre><code>$('.top-bar-wrapper li.active a').after('&lt;div class="nav-active-arrow"&gt;&lt;/div&gt;');
</code></pre>

<p>That code cannot change, I need to work with it as-is.</p>

<p>What I need to do is hide the .nav-active-arrow markup when a button is clicked. So, I have something along the lines of the following:</p>

<pre><code>var navArrow = $('.nav-active-arrow');

$('#nav-bar-churches').click( function(e) {
  churchesBar.show();
  navArrow.hide();
  e.stopPropagation();
});
</code></pre>

<p>There is a bit more to it- for instance, I do a .show on a few events. However, the above code isn't working for me, and I'm guessing it's because <code>.nav-active-arrow</code> is created in the <code>.after()</code> function.</p>

<p>Is my thinking correct? Any suggestions?</p>
