Как изменить данные на ссылку нажмите (используя ajax)?

Question

Мой код работает, но если я нажму ссылку 1, данные ссылки 1 должны показать в div. Если я нажму ссылку 2, данные ссылки 1 исчезнут, и будут отображаться данные канала 2. Но как работает код, отображаются данные канала 1, а затем данные ссылки 2 будут отображаться под ним, и ни один из них не исчезнет.

SQL-:

if(isset($_GET['id'])) 
    { 
$sql_query="SELECT * FROM PresidentialCandidate WHERE ID=".$_GET['id']; 
    $result_set=mysqli_query($mysqli,$sql_query); 
    $row=mysqli_fetch_array($result_set,MYSQLI_ASSOC); 
    } 

Аякса:

jQuery(document).ready(function() { 
    jQuery('a.query-link').on('click', function(e){  
    //Prevent the link from working as an anchor tag 
    e.preventDefault(); 

    //Declare 'this' outside of AJAX because of asynchronous nature of call 
    that = jQuery(this); 

    //Make AJAX call to the PHP file/database query 
    jQuery.ajax({ 
     url:'http://dirtypoliticsph.com/chart-submission/templatecode.php', 
     type:'GET', 
     data:{id:jQuery(this).attr('data-id')}, 
     success:function(data){ 
      jQuery('#myStyle').append(data); 
     } 
    }); 
}); 
    }); 

Answer 1

заменить: -

jQuery('#myStyle').append(data); 

с

jQuery('#myStyle').html(data); 

append добавляет data к нижней части #myStyle где html заменит содержание в #myStyle.