So you want only complete sentences and only if they are less than 140? Is that right?
It took me a bit of reading to sort things out (but that’s good practice for me - I usually only read my own code).
Right now, the way you have things setup is considered a “bad practice” - that is, putting event handlers right in your HTML. That mixes HTML (content) and Javascript (behavior), plus you can only have one function per element handler that way. It’s usually better to use addEventListener in your Javascript which will listen for clicks to elements and respond to those. (and you can have more that one handler bound, in cases where that is needed).
I mention this not only because it is considered “bad practice” but because it is also the source of your problem.
I stepped through your function for building the quote string - it works fine, actually. The issue is that you have the whenClicked function bound to the button click and the dynamicURL function bound to the anchor click.
But your dynamicURL function expects an argument - the combined string produced by whenClicked. But it receives no argument when bound the way you have it. Thus, your undefined value.
addEventListener on MDN
This should really be handled with one addEventListener in your Javascript - bind it to the quote button. Inside the event handler, run the whenClicked function to build the string, pass the results of that function into your dynamicURL function. This will update the anchor url everything should work (in fact, I know it work sbecause I modified your pen and it works just fine).
If you want to see what I did, the code looks like this:
I added an ID of ‘quoteButton’ to your bad ass technical woman button to make it easy to select. I deleted the click handlers from the HTML.
Then I bound a click handler to the button.
document.getElementById( 'quoteButton' ).addEventListener( 'click', function(){
dynamicURL( whenClicked() );
});
And that’s it! You are very close.
Other notes:
You have a stray ‘v’ on a commented line that is causing an error.
You don’t have jQuery on your page, but you do have bootstrap. Bootstrap needs jquery and it’s throwing an exception.
Using the development console (F12) in your browser will help spot errors like that. Also, you can use
debugger;
Statements inside the code to get the browser to pause execution. This way you can inspect values and step through instructions one by one to see what is happening. It’s extremely useful (I really can’t stress that enough) and really valuable to get the hang of.
Final note, your tweet building function is awfully involved. You could save yourself a lot of gymnastics by making sure your quotes in your quoteArray are just data (not markup) and then updating the markup in the page with the data (using properties like .text and .href).
That way you can use some simple array functions and str.length checking to build the tweets you are after.
That’s just another approach - your way works too!
Hope all of this was worth the read!
Regards,
Micheal