Web page content is not refreshed via json function (data)

I am trying to refresh a webpage on the fly after inserting some data into the db and returning a json object to no avail.

Let's say I have

<div id="try1"> try(<span id="votes1">0</span>)</div>

      

        
        
        
      

    

When you skip the page, the current number of votes (0) is displayed at the current moment.

then i have a button

<button  onclick="vote(1);">+</button>

      

        
        
        
      

    

which calls this function:

function vote(votes_id)
{

  var div = 'try' +votes_id;

  var url = 'vote.php?id=' +votes_id;

  var destination = '#votes' +votes_id;

  $.getJSON( url, function(data) {
    $(destination).html (data.votes);

  }); 

}

      

        
        
        
      

    

my vote.php returns this json either after updating the db correctly or at least this is what I think

{"votes":"1"}

      

        
        
        
      

    

However, my web page does not update from 0 to 1,

I use $data = json_encode($data);

which results in var_dump:

string '{"votes":"1"}'

      

        
        
        
      

    

and

{"votes":"1"}

      

        
        
        
      

    

as data echo $.

What am I missing?