Twitter Share Button With Random Quote

I have a problem with Twitter share button. I am creating random quotes machine which shows up a random quote and I want to make Twitter share button for actual quote that is showi

Solution 1:

I added ids and an event listener to detect clicks on the new Quote button rather than running the function from the onclick attribute and then added the text to the href attribute of the tweet button.

var btn = document.getElementById( 'newQuote' );

btn.addEventListener( 'click', function(){
    var randomNumber = Math.floor(Math.random() * (quotes.length));
    document.getElementById('quoteDisplay').innerHTML = quotes[randomNumber];
    document.getElementById( 'twitterShare' ).href="https://twitter.com/intent/tweet/?text=" +  quotes[randomNumber];
});

Here's a working jsFiddle.

Solution 2:

put <script src="javascript.js"></script> on the top or add listener to your button

var quotes = [
  'Don\'t cry because it\'s over, smile because it happened. - Dr. Seuss',
  'Two things are infinite: the universe and human stupidity; and I\'m not sure about the universe. - Albert Einstein',
  'Be who you are and say what you feel, because those who mind don\'t matter, and those who matter don\'t mind. - Bernard M. Baruch',
  'You only live once, but if you do it right, once is enough. - Mae West',
  'Be the change that you wish to see in the world. - Mahatma Gandhi',
  'In three words I can sum up everything I\'ve learned about life: it goes on. - Robert Frost',
  'If you tell the truth, you don\'t have to remember anything. - Mark Twain',
  'Always forgive your enemies; nothing annoys them so much. - Oscar Wilde',
  'Live as if you were to die tomorrow. Learn as if you were to live forever. - Mahatma Gandhi',
  'To live is the rarest thing in the world. Most people exist, that is all. - Oscar Wilde',
  'Life is what happens to us while we are making other plans. - Allen Saunders',
  'I have not failed. I\'ve just found 10,000 ways that won\'t work. - Thomas A. Edison',
  'The man who does not read has no advantage over the man who cannot read. - Mark Twain',
  'I like nonsense, it wakes up the brain cells. Fantasy is a necessary ingredient in living. Dr. Seuss',
  'That which does not kill us makes us stronger. - Friedrich Nietzsche',
  'If you judge people, you have no time to love them. - Mother Teresa',
  'For every minute you are angry you lose sixty seconds of happiness. - Ralph Waldo Emerson',
  'It is never too late to be what you might have been. - George Eliot',
  'I\'m not upset that you lied to me, I\'m upset that from now on I can\'t believe you. - Friedrich Nietzsche',
  'Everything you can imagine is real. - Pablo Picasso',
  'Sometimes the questions are complicated and the answers are simple. - Dr. Seuss',
  'We don\'t see things as they are, we see them as we are. - Anaïs Nin'
]

document.getElementsByClassName('button')[0].addEventListener('click', functionnewQuote() {
  var randomNumber = Math.floor(Math.random() * (quotes.length));
  document.getElementById('quoteDisplay').innerHTML = quotes[randomNumber];
});

<divclass="container-fluid"><h1>Random Quote Machine </h1><p>Check your quote of the today!</p><divid="quoteDisplay"></div></div><center><buttonclass="button">New Quote</button><aclass="twitter-share-button"href="https://twitter.com/intent/tweet/?text="target="_blank"><buttonclass="button1"><imgsrc="https://s6.postimg.org/cn7i6cgfl/if_Twitter_UI-01_2310223.png" />Tweet!</button></a></center>

Solution 3:

Demo

set the text to href attribute

document.querySelectorAll('.twitter-share-button')[0] get the twitter share anchor tag and update the href

functionnewQuote() {
   var randomNumber = Math.floor(Math.random() * (quotes.length));
   document.getElementById('quoteDisplay').innerHTML = quotes[randomNumber];
   document.querySelectorAll('.twitter-share-button')[0].href='https://twitter.com/intent/tweet/?text=' + quotes[randomNumber];
}

document.querySelectorAll(selectors);