Search code examples
jqueryappendto

Append html output to a different div


I have two divs

<div id="ResultsId">
    Here are the results from the session!<br>
</div>

and

<div id="DatesSearchResultsId">
    <a href="#" onclick="SearchDateAjax('DatesSearchResultsId');">Click here to search by date</a>
    <form name="dateSearch" action="searchbydate.php" method="post">
    date: <input type="date" name="date"><br>
</form>
</div>

How would I append the html output from the code below to the ResultsId Div using the AppendTo() method? I cant seem to get it to work:

function SearchDateAjax(DatesSearchResultsId){
    $.ajax({
      type: "POST",
      url: "searchbydate.php",
      cache: false,
      data: "name=Peter&location=Sheffield&date=" + $('input[name="date"]').val(),
      success: function(html, status){
        $("#"+ResultsId).append(html);
        //$('#status').append(status);
      } 
    });
}

Solution

  • Since the ID of the div you want is "ResultsId", you would select it using $('#ResultsID'). You currently have $("#"+ResultsID), which will add the value of the variable ResultsID to the "#".