Blogger button for random 'post, search and combine labels'

Question

I am using the below javascript and html to create a button that returns random posts from a (single) label. my blog is: https://funatonce.blogspot.com

I have two queries:

1. How can I use this script with a list of search terms. I will enter a group of search terms which keeps giving different results on every click

2. I want to add multiple buttons with random function for different labels, so for eg. if I have 15 buttons do I have to add this script 15 times on the page? I tried giving a .js file reference but it didn't worked

   http://yourjavascript.com/8012111731/random.js'; type='text/javascript'/>

<script type='text/javascript'>
//<![CDATA[
function showLucky(root){
    var feed = root.feed;
    var entries = feed.entry || [];
    var entry = feed.entry[0];
      for (var j = 0; j < entry.link.length; ++j) {
       if (entry.link[j].rel == "alternate") {
       window.location = entry.link[j].href;
       }
      }
   }

function fetchLuck(luck){
    script = document.createElement('script');
    script.src = '/feeds/posts/summary/-/cool%20items?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky';
    script.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(script);
   }
function readLucky(root){
    var feed = root.feed;
    var total = parseInt(feed.openSearch$totalResults.$t,10);
    var luckyNumber = Math.floor(Math.random()*total);
    luckyNumber++;
    fetchLuck(luckyNumber);
    }
function beautyandpersonalcare(){
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = '/feeds/posts/summary/-/cool%20items?max-results=0&alt=json-in-script&callback=readLucky';
    document.getElementsByTagName('head')[0].appendChild(script);
    }
//]]>
</script>

<div class="randombtncontainer">
  <a href="#" onclick="beautyandpersonalcare()" class="randombtn btn-1">Show Random Products</a>
  
</div>

Answer 1

You can get search results by using jQuery ajax and native search function on blogger instead of JSON feed

<div id="container"></div>

<script>
//<![CDATA[
var counter = 0;
function getList(terms) {
  $("#container").load("/search?q="+terms[counter].replace(' ', '+')+" #Blog1 .post");
  counter++;
}
//]]>
</script>

<button onclick="getList(['mobile cases','mobile accessories','mobile apps'])">Show Random List</button>

To add multiple buttons with different labels, you do not need to repeat your functions as in js file, Pass labels as arguments in beautyandpersonalcare() and add buttons as much as you like.

<script type='text/javascript'>
//<![CDATA[

var label = "";

function showLucky(root){
    var feed = root.feed;
    var entries = feed.entry || [];
    var entry = feed.entry[0];
      for (var j = 0; j < entry.link.length; ++j) {
       if (entry.link[j].rel == "alternate") {
       window.location = entry.link[j].href;
       }
      }
   }

function fetchLuck(luck){
    script = document.createElement('script');
    script.src = '/feeds/posts/summary/-/'+label+'?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky';
    script.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(script);
   }
function readLucky(root){
    var feed = root.feed;
    var total = parseInt(feed.openSearch$totalResults.$t,10);
    var luckyNumber = Math.floor(Math.random()*total);
    luckyNumber++;
    fetchLuck(luckyNumber);
    }
function beautyandpersonalcare(lab){
    label = lab;
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = '/feeds/posts/summary/-/'+label+'?max-results=0&alt=json-in-script&callback=readLucky';
    document.getElementsByTagName('head')[0].appendChild(script);
    }
//]]>
</script>

<div class="randombtncontainer">
  <a href="#" onclick="beautyandpersonalcare('labelName1')" class="randombtn btn-1">Show Random Products</a>
  <a href="#" onclick="beautyandpersonalcare('labelName2')" class="randombtn btn-2">Show Random Products</a>
  <a href="#" onclick="beautyandpersonalcare('labelName3')" class="randombtn btn-3">Show Random Products</a>
  ...

</div>