Posting Randomly generated quotes from codepen to twitter

The following code send the link of my codepen to twitter but I wan to send just the quote text from the codepen.
HTML and JQuery part is as following:-1:

<div id="tweet" class="text-center">         
  <a href="" class="twitter-share-button"
   data-text="This is what we want to change dynamically"    
    data-count="none" data-via="bindu_verma">Tweet</a>        

      $(this).attr('data-text', "This works!");

I’ve edited your post for readability. When you enter a code block into the forum, remember to precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.


I’ve spent a long time trying to adapt the Twitter Share button. The problems I encountered were:

  • widget.js replaces the <a> element with an <iframe>. It has a corresponding <a> deep inside its bowels but with a hard coded query in the href. There are no data-* properties anywhere to fiddle with.

  • So I replaced the button every time the quote was updated, using the factory function createShareButton offered by widget.js to create the button. It worked but it was slow and you could see the button disappear and reappear.

  • I tried using a documentFragment to do the DOM manipulations without refreshing the screen but I couldn’t make it work with createShareButton.

In the end, I gave up on the Twitter Share button and implemented it with a Web Intent URL. A lot easier to implement and it works well.

Can you show your example to see how it works?