jQuery unable to toggle after 'instant search'
<p>I have a jQuery search that gets a search term from the user and queries a mySQL DB via php in order to populate a div (with flashcard-like questions and answers). This works perfectly well. I am also using a jQuery toggle function to try to hide the answer until the word "Answer" is clicked. This also works fine as a standalone, and with text already on the html page - however, it won't work on the text populated in from the search, even though the div id's etc seem fine. Somehow the toggle function can't act on the searched text. Here is the code: </p>

<p><strong>HTML: index.php</strong></p>

<pre><code>    &lt;html lang="en"&gt;
    &lt;head&gt;
    &lt;meta charset = "utf-8"&gt;
    &lt;title&gt; JQ Instant Search&lt;/title&gt;
    &lt;link rel ="stylesheet" type = "text/css" href = "css/style.css"&gt;

    &lt;/head&gt;
    &lt;body&gt;

    Start Search: &lt;input id = "search" type = "text"/&gt;
    &lt;div id="search_results"&gt;&lt;/div&gt;
    &lt;script type="text/javascript" src = "js/jquery.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src = "js/search.js"&gt;&lt;/script&gt;
        &lt;h4 id="question1"&gt;Question 1 - Which animal barks?&lt;/h4&gt;

        &lt;ol&gt;
        &lt;li&gt;1. Giraffe &lt;/li&gt;
        &lt;li&gt;2. Worm &lt;/li&gt;
        &lt;li&gt;3. Dog &lt;/li&gt;
        &lt;/ol&gt;

    &lt;div class="explain"&gt;&lt;a href="#" id="b" class="comment"&gt;Answer&lt;/a&gt;&lt;/div&gt;
    &lt;div id="commentboxb" class="commentbox" style="display:none"&gt;The answer is 3.   Anyone should know this&lt;/div&gt;


     &lt;/body&gt;
     &lt;/html&gt;
</code></pre>

<p><strong>JS: search.js</strong></p>

<pre><code>         $('#search').keyup(function() { 
         var search_term = $(this).val();
         $.post('php/search.php ', { search_term: search_term},  function(data){
         $('#search_results').html(data);
         }); 
         });    
         $(document).ready(function() {
         $('#commentbox').hide();
         $('a.comment').click(function() {
          var id = $(this).attr('id');
         $('#commentbox' + id).toggle(200);

         return false;
         });
         });
</code></pre>

<p><strong>PHP: search.php</strong></p>

<pre><code>        &lt;?php
        require 'connection.php';

        if (isset($_POST['search_term'])){
        $search_term = mysql_real_escape_string(htmlentities($_POST['search_term']));

         if (!empty($search_term)) {
        $search = mysql_query("SELECT `question`, `ans1` FROM `quiz` WHERE `question` LIKE '%$search_term%'");
        $result_count = mysql_num_rows($search);

        $suffix = ($result_count != 1) ? 's' :'';
        echo '&lt;p&gt;Your search for  &lt;strong&gt;'  , $search_term, '&lt;/strong&gt; returned  &lt;font color="red"&gt;&lt;strong&gt;' , $result_count, '&lt;/strong&gt;&lt;/font&gt;  result',  $suffix , '&lt;/p&gt;';
        echo '&lt;div id="wrap"&gt;';
        $i=0;
        while ($results_row = mysql_fetch_assoc($search)) {


            echo '&lt;p&gt;' , $results_row['question'] ,' &lt;/p&gt;';

            echo '&lt;div class="explain"&gt;&lt;a href="#" id="',$i,'" class="comment"&gt;Answer&lt;/a&gt;&lt;/div&gt;';

            echo '&lt;p&gt;&lt;div id="commentbox',$i ,'" class="commentbox" style="display:none"&gt;',$results_row['ans1'],'&lt;/div&gt;&lt;/p&gt;';

            $i=$i+1;
         }
         }
         }
         ?&gt;
</code></pre>

<p><strong>mySQL Table:quiz</strong></p>

<pre><code>    question                    *ans1
    what sound do cows make?        moo
    where is London?            England
    What is the negative cube root of e^-3? obvious
</code></pre>
