Toggling Issues

Toggling Issues

Hi,
I would like to toggle some content. There are few of them. This is my html code:


  1. <li>
    <a class="courseName" href="javascript:void(0)" onclick="">Hardware System Architecture (Course Code: 111)</a>

    <div id="111" style="display:none;width:100%;">Desc blah blah blah</div>
    <br>
    </li>
    <li>
    <a class="courseName" href="javascript:void(0)" onclick="">Software System Architecture (Course Code: 222)</a>
    <div id="222" style="display:none;width:100%;">Desc Blah blah blah</div>
    <br>
    </li> 


and my jquery code is below. My question how do I make the ID dynamic instead of hardcoded?
  2. $( ".courseName" ).click(function() {
  3.  $( "#" + "111" ).toggle( "fast", function() {

  5.  });
  6.  
  7.  $( "#" + "222" ).toggle( "fast", function() {

  9.  });
  10.  
  11. });