title: How to JQuery DIV toggle more dynamic?
body: <p>How do I make the below function more dynamic for example commentLink and commentContainer will have an ID after them like this <strong>commentLink-2289</strong> <strong>commentContainer-2289</strong> because there will be multiple ones in a list.</p>
  
  <h3>Javascript</h3>
  
  <pre><code>$(function() {
      $("#commentLink").click(function() 
     {
          $("#commentContainer").toggle();
          if ($("#commentContainer").is(":visible")) 
          {
              $("#commentContainer").load($(this).attr("href"));
          } else 
          {
               $("#commentContainer").html("Loading..."); //Or just leave it as is...
          }
          return false; //Prevent default action
     });
  });
  </code></pre>
  
  <h3>Html</h3>
  
  <pre><code>&lt;div id="SystemNews"&gt;
   &lt;ul id="dc_news"&gt;
     &lt;li&gt;
       &lt;a href="/Home/SystemNews/69" id="commentLink-0"&gt;Comments&lt;/a&gt;
       &lt;div id='commentContainer-0' style="display:none;"&gt;    Loading...&lt;/div&gt;
     &lt;/div&gt;
     &lt;/li&gt;
     &lt;/ul&gt; 
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Note:</strong> Please provide a working example, I learn best by example thanks</p>