javascriptでhtmlに「disabled」を指定できない

Question

掲示板のコメントの「いいね」ボタンの実装をしています。
ajaxを使い、dbの値を変更し、いいねの数を非同期で変更することには成功いたしました。
「いいね」を1度押すといいねボタンに「disabled」属性がつき、2度と押せないようにしたいのですが、なぜか上手く行きません。

掲示板以外のページで同様の機能を実装済みであり、ほとんど同じコードを使っているのですが、なぜかこのページのみdisabledがつきません。

どなたかお力をお貸しください。

以下がコードになります。

<button id="<?php print $value['comment_id']; ?>" onClick="vote(<?php print $value['comment_id']; ?>)">
<span id="span<?php print $value['comment_id']; ?>"><?php print $value['point']; ?></span>
</button>

function vote(id){
 $(function(){
  $.get('c_vote.php', {
    c_id: id
  }, function(data){
　　document.cookie = 'mbc_c_id' + id + '=' + id + '; max-age=' + 60*60*24*31;
   var span = document.getElementById('span'+id);
   span.innerHTML = data.point;
   var btn = document.getElementById(id);
//ここが効かない
   btn.disabled = 'true';
   });
 });
}

試したこと

cookieのセット、dbの更新、spanの数字の更新は成功しています。
jqueryのpropも使ってみましたが、
Cannot create property 'disabled'
とのエラーが出ました。

Comments

[x_x]

id (PHPの$value['comment_id']) には具体的にどんなものが入ってきますか？

Answer 1

getElementByIdで取得できない時に出るエラーですね。console.log を使うなどしてどのような値がそこに入っているか確認してみてください。

<button id="0" type="button">button</button>

var btn = document.getElementById( 1 );
btn.disabled = 'true';

Uncaught TypeError: Cannot set property 'disabled' of null
```**動くサンプル：**[https://jsfiddle.net/n5ohmL71/](https://jsfiddle.net/n5ohmL71/)

Answer 2

余談ですが、jQueryで組んでいるならもっとjQueryライクなオブジェクトの掴み方と
値の指定方法をとったほうがよいでしょう
またタグにonclickを指定するよりもidやクラスを割り当ててjsの塊のなかで
処理したほうが管理しやすいと思います。