I need to click a button to scroll a quote

Question

I am trying to encode the "Tweet this" button, which opens a new window on Twitter with pre-generated text. What I'm getting now is a Twitter window with the URL from where I came from. I am using the jQuery API for this. Link to my project http://codepen.io/haldav/pen/KVpojP . And my code is:

$(document).ready(function() {
  random();

function random() {
var quotes = ["You must be shapeless, formless, like water. When you pour water in a cup, it becomes the cup. When you pour water in a bottle, it becomes the bottle. When you pour water in a teapot, it becomes the teapot. Water can drip and it can crash. Become like water my friend.", "Defeat is a state of mind; no one is ever defeated until defeat has been accepted as a reality.", "The moment has no yesterday or tomorrow. It is not the result of thought and therefore has no time.", "Real living is living for others.", "Never waste energy on worries or negative thoughts, all problems are brought into existence -drop them.", "A goal is not always meant to be reached. It often serves simply as something to aim at.", "Those who are unaware they are walking in darkness will never seek the light.", "Because one does not want to be disturbed, to be made uncertain, he establishes a pattern of conduct, of thought, a pattern of relationship to man etc. Then he becomes a slave to the pattern and takes the pattern to be the real thing."];

randomQuote = quotes[Math.floor(Math.random() * quotes.length)];
quote = randomQuote.split("randomQuote");
$('.quote').text(quote[0]);
  }

$(".button").on("click", function() {
random();
  });
});

My HTML code is:

<div class="text-center" id="jumbotron">
<h1 class="main-text">The Wisdom of Bruce Lee</h1>
<p class="p-text">Although Bruce Lee died at a considerably young age, he was wise beyond his years. For my random quote machine, I chose to showcase some of his wisdom. For this exercise, I used a little JQuery, Bootstrap, CSS and HTML.        </p>
<div class="well">
  <p class="quote" id="tweet"></p>
</div>
<div class="text-center">
  <button class="button" id="quote">New Quote</button>
  <br />
  <a class="twitter-share-button" href="https://twitter.com/intent/tweet/?text=" data-size="large" target="_blank">
  <button type="button" class="btn btn-primary">Tweet this!</button></a>
</div>
<div footer>
  <p class="text-center">Copyright © David C. Hall 2015</p>
</div>

I'm at a dead end. Any suggestions? Thank you EDIT: I am opening a new window, but I need it to display a random quote in a text box.

Answer 1

I thought! All I had to do was add

$(this).attr("href", 'https://twitter.com/intent/tweet?text=' + randomQuote);

JS-.

Answer 2

target="_blank" .

Html

    <div class="text-center" id="jumbotron">
    <h1 class="main-text">The Wisdom of Bruce Lee</h1>
    <p class="p-text">Although Bruce Lee died at a considerably young age, he was wise beyond his years. For my random quote machine, I chose to showcase some of his wisdom. For this exercise, I used a little JQuery, Bootstrap, CSS and HTML.        </p>
    <div class="well">
      <p class="quote" id="tweet"></p>
    </div>
    <div class="text-center">
      <button class="button" id="quote">New Quote</button>
      <br />
<!--changes made here --->
      <a class="twitter-share-button" href="https://twitter.com/intent/tweet/?text=" data-size="large">
      <button type="button" class="btn btn-primary">Tweet this!</button></a>
    </div>
    <div footer>
      <p class="text-center">Copyright © David C. Hall 2015</p>
    </div>