Skip to content

Instantly share code, notes, and snippets.

@Nerajno
Created September 10, 2018 13:37
Show Gist options
  • Select an option

  • Save Nerajno/078180108723a2edab221ae780d07e0e to your computer and use it in GitHub Desktop.

Select an option

Save Nerajno/078180108723a2edab221ae780d07e0e to your computer and use it in GitHub Desktop.
Jquery 1
Apples and Bananas
Given this HTML_BODY_CONTENT:
<h1 id="header"></h1>
<button id="i">I</button>
<button id="like">like</button>
<button id="to">to</button>
<button id="eat">eat</button>
<button id="apples">apples</button>
<button id="bananas">bananas</button>
Write the JS_CODE to make it so than any of the buttons are clicked, the word on the button is appended to the header, plus an extra space character.
Apples and Bananas Redux
Extend your solution from the previous exercise and add a Piglatin button:
<button id="piglatin">Piglatin</button>
When it is clicked, it piglatin-izes each word that is currently in the header. You may use a previous piglatin function you've written.
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--<link rel="stylesheet" type="text/css" media="screen" href="main.css" />-->
</head>
<body>
<!-- HTML_BODY_CONTENT -->
<h1 id="header"></h1>
<button id="I">I</button>
<button id="like">like</button>
<button id="to">to</button>
<button id="eat">eat</button>
<button id="apples">apples</button>
<button id="bananas">bananas</button>
</body>
<!-- JS_CODE -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
// $("button").on("click",function() {
// var buttonTxt = $("button").text();
// console.log('this wrks');
// var text = $('h1').text(buttonTxt)+" ";
// // $("h1").append(buttonTxt).text();
// console.log(buttonTxt);
// });
function redux(text) {
var result = '';
for(var i =0; i < text.length; i++){
result = text[i]+ result;
}
return result;
}
// need a better walk through for this.
$("button").on("click",function() {
$('h1').append(redux($(this).text())+" ");
});
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment