SHARE
TWEET

Untitled

a guest Aug 20th, 2019 79 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <div class="fruitsCalc">
  2.     <div class="container">
  3.         <div class="fruits" id="Apple" data-name="Apple" onclick="fruitClick()">Apple</div>
  4.         <div class="fruits" id="Orange" data-name="Orange" onclick="fruitClick()">Orange</div>
  5.         <div class="fruits" id="Apricot" data-name="Apricot" onclick="fruitClick()">Apricot</div>
  6.     </div>
  7.     <div class="container">
  8.         <div class="fruits" id="Mandarin" data-name="Mandarin" onclick="fruitClick()">Mandarin</div>
  9.         <div class="fruits" id="Stawberry" data-name="Stawberry" onclick="fruitClick()">Stawberry</div>
  10.         <div class="fruits" id="Rastberry" data-name="Rastberry" onclick="fruitClick()">Rastberry</div>
  11.     </div>
  12.     <div class="result">
  13.         <h2 style="text-align: center">RESULT:</h2>
  14.     </div>
  15. </div>
  16.  
  17.  
  18.  
  19. let arr = [
  20.     {title: 'Apple', val: "25 cal."},
  21.     {title: 'Orange', val: "35 cal."},
  22.     {title: 'Apricot', val: "45 cal."},
  23.     {title: 'Mandarin', val: "55 cal."},
  24.     {title: 'Stawberry', val: "65 cal."},
  25.     {title: 'Rastberry', val: "75 cal."},
  26. ];
  27.  
  28. function fruitClick() {
  29.      let result = document.querySelector('.result');/
  30.      for (let i in fruitItem) {
  31.  
  32.          let out = '';
  33.          fruitItem[i].onclick = function () {
  34.              for (let x in arr) {
  35.               if (fruitItem[i].getAttribute('data-name') == arr[x].title) {
  36.                     out += `<p>${arr[x].val}</p>`;
  37.                 }
  38.             }
  39.             result.innerHTML = out;
  40.         }
  41.      }
  42.  }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top