mysql_fetch_array

Problems defining a good hide/unhide jQuery function for dynamic divs
$(document).ready(function() {
  $('#job_desc').hide();
  $('#slick-toggle').click(function() {
    $('#job_desc').toggle(400);
    return false;
  });
});
   
while($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
echo '<div id="job_desc['.$row["id_exp"].']">'.$job_desc.'</div>'
}
   
while($row = mysql_fetch_assoc($result))
{
  echo '<div id="job_desc'.$row['id_exp'].'" class="hidable">'.$job_desc.'</div>';
}
   
$(document).ready(function() {
   $('.hidable').hide();
   $('.hidable').click(function() {
    var the_id = $(this).attr('id');
   $('#'+the_id).toggle(400);
  });
});
   
$('.hidable').hide();
$('a#slick-toggle').click(function(){
  $('.hidable').toggle(400);
  return false;
}
   
while($row = mysql_fetch_assoc($result))
{
  echo '<div id="job_desc'.$row['id_exp'].'" class="hidable">'.$job_desc.'<a class="slick-toggle" href="desc'.$row['id_exp'].'">toggle</a></div>';
}
   
$(document).ready(function() {
    $('.hidable').hide(); // hides all divs;
    $('a.slick-toggle').click(function(){
      var the_id = $(this).attr('href');  //gets href
      var div_id = $('#job_' + the_id);  //takes the div id, which is made up with the href
      $(div_id).toggle(400);  //now can match the div
      return false;
    }
});
   
$('.togglelink').live('click',(function(event) {
        event.preventDefault();
        $('#' + $(this).attr('href')).toggle();
    })
);
   
$('.togglelink').live('click',(function(event) {
   
event.preventDefault();
   
$('#' + $(this).attr('href')).toggle();
   
<span class="toggleright"><a class="togglelink" href="showdetails">Show / Hide</a></span>
<span class="subheading">A Heading</span>
<div id="showdetails" style="display:none;">
Some content
</div>
   
echo '<div id="job_desc_'.$row["id_exp"].'">'.$job_desc.'</div>';
   
$(document).ready(function() {
  $('div[id^="job_desc_"]').hide();
});