I feel like I’m getting really close to meeting all requirements, but I can’t seem to properly capture the quote displayed when I use the “Tweet” button…
http://codepen.io/jscogg/pen/jAoExN
EDIT: Tweet button functioning properly now. I’m not sure about the positioning, but I can figure that out later. 
Nice implementation. My note - try to remove horizontal scrolling
You need dynamically load text to data-text for ur tweet button as user click on button next
Current u load that text into ur tweet button once, as page load
Well, I changed the code to remove any existing twitter buttons once the NEXT button is clicked and then added the code that renders the button to the sendAJAX(); function so that it fires every time the ajax function does. Unfortunately, it’s loading the data-text of the quote previously displayed instead of the quote currently displayed. 
You need to asign data to ur tweet button in
xhr.onreadystatechange
cause AJAX is async operation
YES! That’s the ticket! I’ve fixed it now. 
Hmm… the embed is the only thing that has the horizontal scrolling for me (testing using the responsive features in Chrome Dev Tools). I wonder why…
I tried to change
width: 100vw to width: 100%;
to html, body and those two containers
and it works
I wonder why it makes a difference… huh… 
