For loop in jQuery. How to?
<p>How can I replace this for-each loop with jQuery?</p>

<pre><code>$(document).ready(function(){
    hidebutton = $("#hideall");
    hidebutton.click(function(){
        for(i=1;i&lt;=6;i++){
                var countrylist = document.getElementById("Country-"+i);
                countrylist.style.display = "none";
            }
    });
});
</code></pre>

<p>The HTML is</p>

<pre><code>&lt;input id="hideall" type="button" value='Hide Countries' /&gt;&lt;br /&gt;&lt;br /&gt;
&lt;div id="Country-1"&gt;USA&lt;/div&gt;
&lt;div id="Country-2"&gt;UK&lt;/div&gt;
&lt;div id="Country-3"&gt;UAE&lt;/div&gt;
&lt;div id="Country-4"&gt;China&lt;/div&gt;
&lt;div id="Country-5"&gt;India&lt;/div&gt;
&lt;div id="Country-6"&gt;Japan&lt;/div&gt;
</code></pre>
