I Need your Help for This Coding Because it doesn't work or only working for 1 class of javascript. Here's My Coding
HTML
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<div="container">
<div>
<p class="Text" id="fruit">Grape</p>
</div>
<p class="Text" id="animal">Shark</p>
</div>
</div>
<div="container">
<div>
<p class="Text" id="fruit1">Strawberry</p> //The coding of javascript only works in fruit or in animal
</div>
<p class="Text" id="animal1">Unicorn</p>
</div>
</div>
</body>
</html>
Javascript internal
<script>
var fruit = ["Apple", "Banana", "Cerry", "Dragonfruit","Eldberry", "Guava", "Jackfruit", "Longan", "Mango", "Orange", "Pineapple", "Watermelon"];
var t = setInterval(function() {
var randomNumber = Math.round( Math.random() * (fruit.length-1) );
$('.fruit').html( fruit[ randomNumber ] );
}, 5000);
document.getElementByID("fruit").innerHTML;
</script>
Thankyou sir
First, you had typo in your last line of JavaScript - document.getElementByID("fruit").innerHTML; (ID is supposed to be Id) - document.getElementById("fruit").innerHTML;
I've changed, instead of using JQuery, I used pure JavaScript.
var fruit = ["Apple", "Banana", "Cerry", "Dragonfruit","Eldberry", "Guava", "Jackfruit", "Longan", "Mango", "Orange", "Pineapple", "Watermelon"];
var t = setInterval(function() {
var randomNumber = Math.round( Math.random() * (fruit.length-1) );
const frt = document.getElementById('fruit'); //get element that you want to change
frt.innerHTML = fruit[randomNumber];//set the value
}, 1000); <head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<div="container">
<div>
<p class="Text" id="fruit">Grape</p>
</div>
<p class="Text" id="animal">Shark</p>
</div>
</div>
<div="container">
<div>
<p class="Text" id="fruit1">Strawberry</p>
</div>
<p class="Text" id="animal1">Unicorn</p>
</div>
</div>
</body>
</html>you are calling an ID using "dot" insted of "#" you need to change for animal $('.animal') to $('#animal') and $('.animal1') to $('#animal') same for fruit1.
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<div="container">
<div>
<p class="Text" id="fruit">Grape</p>
</div>
<p class="Text" id="animal">Shark</p>
</div>
</div>
<div="container">
<div>
<p class="Text" id="fruit1">Strawberry</p>
<!-- The coding of javascript only works in fruit or in animal -->
</div>
<p class="Text" id="animal1">Unicorn</p>
</div>
</div>
<script>
var fruit = ["Apple", "Banana", "Cerry", "Dragonfruit","Eldberry", "Guava", "Jackfruit", "Longan", "Mango", "Orange", "Pineapple", "Watermelon"];
var t = setInterval(function() {
var randomNumber = Math.round(Math.random()*(fruit.length-1));
$('#fruit').html(fruit[randomNumber]);
}, 1000);
document.getElementById("fruit").innerHTML;
var animal = ["Ant", "Bear", "Cat", "Dogt","Elephant", "Gorilla", "Horse", "", "Jelly fish", "Lion", "Monkey", "Pinguin", "Rabit", "Sheep", "Turtle", "Unicorn", "Zebra"]; var t = setInterval(function() { var randomNumber = Math.round(Math.random()*(animal.length-1)); $('#animal').html(animal[randomNumber]); }, 1000); document.getElementById("animal").innerHTML;
var fruit = ["Apple", "Banana", "Cerry", "Dragonfruit","Eldberry", "Guava", "Jackfruit", "Longan", "Mango", "Orange", "Pineapple", "Watermelon"]; var t = setInterval(function() { var randomNumber = Math.round(Math.random()*(fruit.length-1)); $('#fruit1').html(fruit[randomNumber]); }, 1000); document.getElementById("fruit1").innerHTML;
var animal = ["Ant", "Bear", "Cat", "Dogt","Elephant", "Gorilla", "Horse", "", "Jelly fish", "Lion", "Monkey", "Pinguin", "Rabit", "Sheep", "Turtle", "Unicorn", "Zebra"]; var t = setInterval(function() { var randomNumber = Math.round(Math.random()*(animal.length-1)); $('#animal1').html(animal[randomNumber]); }, 1000); document.getElementById("animal1").innerHTML;
</script>
</body>
</html>