How to select for something that begins with a string but doesn't end with a different string in jQuery?
<p>I am new to jQuery, exploring its syntax a bit. </p>

<p>My page has elements like this:</p>

<pre><code>&lt;area id="SA" ... /&gt;
&lt;area id="AF" ... /&gt;
&lt;area id="EU" ... /&gt;
&lt;area id="NA" ... /&gt;
</code></pre>

<p>I am trying to show and hide <code>div</code> sections based on click events off the <code>area</code> tags, which have matching ending ID's, coded like this:</p>

<pre><code>&lt;div id="div_SA" ... /&gt;
&lt;div id="div_AF" ... /&gt;
&lt;div id="div_EU" ... /&gt;
&lt;div id="div_NA" ... /&gt;
</code></pre>

<p>So, to show the exact match, but hide all the <code>div</code> sections which have id's that start with "div_" but don't otherwise match, without hiding every other <code>div</code> on the page, I tried this:</p>

<pre><code>    var q = 'div[id="div_' + event.target.id + '"]';
    var r = 'div[id^="div_"],div:not[id$=' + event.target.id + '"]';
    $(q).show();
    $(r).hide();
</code></pre>

<p><code>$(r).hide();</code> is not working. What am I doing wrong? (I know I could assign CSS classes and get at them with class names, but I'm still curious about how to construct a query that will work this way.)</p>
