title: Writing to a data-* attribute and getting it with jQuery .data()
body: <blockquote>
    <p><strong>Possible Duplicate:</strong><br>
    <a href="https://stackoverflow.com/questions/12320934/jquery-data-not-updating-dom">jQuery .data() Not Updating DOM</a>  </p>
  </blockquote>
  
  
  
  <p>I am having a problem with using the on attribute. I have written a small set of methods to send api calls. </p>
  
  <p>The markup is like this:</p>
  
  <pre><code>&lt;div data-global-id="1318" data-action="unfollow" class="action text-as-link follow-btn btn" style="text-decoration: none;"&gt;unfollow&lt;/div&gt;
  </code></pre>
  
  <p>and have an event capture like this:</p>
  
  <pre><code>$(document).on('click','.action', function(){
    var t={};
    t.args={};
    t.args.global_id=$(this).data('global-id');
    t.global_id=t.args.global_id;
    t.action=$(this).data('action');
    t.identifier=t.action + '_v2';
    alert('here is action: ' + t.action);
    api_post_v1(t);
  });
  </code></pre>
  
  <p>The api_post_v1 correctly sends the call. </p>
  
  <p>There is some code to handle the callback and it sets the markup to:</p>
  
  <pre><code>&lt;div data-global-id="1318" data-action="follow" class="action text-as-link follow-btn btn" style="text-decoration: none;"&gt;follow&lt;/div&gt;
  </code></pre>
  
  <p>The code for this is like:</p>
  
  <pre><code>$foo=$('.action[data-action=unfollow][data-global-id='+global_id+']');
  $foo.attr('data-action','follow');
  </code></pre>
  
  <p>The key piece is the data-action. I'd like the call to the event handler above to say it is 'follow' but it says it is still 'unfollow'. </p>
  
  <p>The sequence is the following:</p>
  
  <ol>
  <li>load page, the data-action='unfollow'</li>
  <li>click this, api call gets made and you are not following this user; the callback sets data-action='follow'</li>
  <li>click this value again and the data-action is echoed as 'unfollow' rather than 'follow'</li>
  </ol>
  
  <p>How could I tell jQuery to refresh the bindings of this event? I thought this was what $(document).on does.</p>
  
  <p>thx</p>