Revamp your JavaScript code to trigger when the clock strikes bold!

Having trouble setting up JavaScript to automatically bold the next clock time. Any tips on rewriting the JavaScript? For instance, if it is currently 6:49, I want the next clock time of 7:32 to be automatically bolded. And when the time reaches 7:32, I want 8:01 to be automatically bolded next. So, essentially, always bolding the upcoming time once the current time has passed.

jQuery(document).ready(function($) {
  var hour = new Date().getHours();

  $('table td:nth-child(1)').each(function(index, td) {
    if ($(td).text().indexOf(hour) == 00) {
      $(td).addClass('highlight-time');
    } else {
      $(td).removeClass('highlight-time');
    }
  });
});
.highlight-time {
  font-weight: bold;
}
<table>
  <tbody>
    <tr>
      <td style="padding-left: 0px;width: 75px;">6:49</td>
      <td style="padding-left: 0px; padding-right: 0px;">BLERI-COM</td>
    </tr>
    <tr>
      <td style="padding-left: 0px;width: 75px;">7:32</td>
      <td style="padding-left: 0px; padding-right: 0px;">ENDRITI</td>
    </tr>
    <tr>
      <td style="padding-left: 0px;width: 75px;">8:01</td>
      <td style="padding-left: 0px; padding-right: 0px;">BEKA-KAQANIK</td>
    </tr>
    <tr>
      <td style="padding-left: 0px;width: 75px;">8:21</td>
      <td style="padding-left: 0px; padding-right: 0px;">MEDINA</td>
    </tr>
    <tr>
      <td style="padding-left: 0px;width: 75px;">8:59</td>
      <td style="padding-left: 0px; padding-right: 0px;">METI-COMERC</td>
    </tr>
    <tr>
      <table>
        <tbody>

javascript

Answer №1

To make your Javascript code execute at intervals, you can place it within a function and then call that function after a specified time period. For example, if you have a function called setBold() containing the code you want to run every three seconds, you can set up an interval like this:

var myVar=setInterval(function(){setBold()}, 3000);

This will ensure that the setBold() function is executed every three seconds. You can adjust the interval to suit your needs - for instance, if you want to bold text every hour, you can set the interval to the equivalent of one hour:

For a one-hour interval, you would use the following code:

var myVar=setInterval(function(){setBold()}, (1000*60*60));

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is there a way to use Ajax to analyze and contrast information from two separate web links?

I am looking to compare and display the genre_ids from the first link and the id from the second link. Example: genre_ids: [ 18, 878, ] { id: 18, name: "Drama", }, { id: 878, name: "Science Fiction", } Result: Drama, Science Fiction $(document).ready( ...

javascriptjqueryajaxobjectcompare

Variety of part ingredients

In my component, I have a button and include another component which also contains a button. How can I align these two buttons next to each other without using absolute positioning? When I try positioning them using absolute right and top values, the lay ...

javascripthtmlcssangularangular2-template

Show/Hide a row in a table with a text input based on the selected dropdown choice using Javascript

Can someone please assist me with this issue? When I choose Business/Corporate from the dropdown menu, the table row becomes visible as expected. However, when I switch back to Residential/Consumer, the row does not hide. My goal is to only display the row ...

javascript

Is it possible to use both the filter $select.search and the limitTo $select.infiniteCurrentLimit on a single ui-select field?

I am facing a challenge with my ui-select field which utilizes infinite-scroll functionality due to having a large number of options. However, it becomes cumbersome to scroll down and find the desired option among so many choices. <ui-select-choices ...

javascriptangularjsinfinite-scrollui-select

Angular JS - the culprit behind app crashes in Safari and IE

I'm encountering an issue with my Angular JS app. There is some code that counts the characters from an array, but for some reason it is causing the app to break and stop working in Safari and IE. I've tried to figure out what's wrong, but c ...

javascriptangularjsinternet-explorersafari

The carousel is failing to display two items on each slide

I've integrated a carousel library from npm into my project. However, I'm facing an issue where I need to display two cards in each slide within the carousel. Here's a snippet of my code: Catalog.js import React from 'react'; impo ...

javascriptreactjsmaterial-uicarousel

Uncertainties surrounding the complexity of this multi-stage form

Exploring this multi-step form I have a couple of questions: 1) Is there a way to transfer the value from the first step to the second step of the form? 2) How can I ensure that the datepicker value is not empty (to prevent user progress in the firs ...

javascriptphphtmlcss

Getting the true height without needing jQuery

let element = document.getElementById('test'); console.log(element.scrollHeight); <div style="height: 30px;" id="test"> <p>ffffffffff</p> <p>gggggggggg</p> ...

javascripthtmlcss

Issues with Mocha's beforeEach() and done() functions not functioning as expected

I am facing an issue with my Mocha test suite. When I run the 'make test' command, I encounter the following error message: Uncaught TypeError: Object [object Object],[object Object] has no method 'done' Below is the relevant code sni ...

javascriptnode.jsexpressmocha.js

What is the best way to access and interpret a JSON file within an Angular application?

I am facing difficulties while trying to load a JSON file from my local disk in order to populate a FabricJS canvas with the data. Currently, I am encountering issues retrieving the data from the file. Here is what I have attempted so far. app.html < ...

javascriptangularjsjsonfabricjsfilereader

What is the best way to upload a file in Node.js using Express and Multer?

When attempting to send a file from the front end to my node js server, I encountered an issue with receiving the file on the back end. Here is the code snippet: <form id="file-upload-form" class="uploader" action="/uploa ...

javascriptnode.jsexpressxmlhttprequestmulter

Arrangement of jQuery On Events and Triggers

Consider the code snippet below: $('body').on('hellothere', function(){ console.log('execution complete.'); }); $('body').triggerHandler('hellothere'); The abov ...

javascriptjqueryeventstriggers

Analyzing file data while uploading the file

Does anyone have a solution for extracting the content from an uploaded file in express/nodejs without saving it as a temporary file? I have code that successfully pipes the input to a filestream, but I'm struggling to deserialize the upload to a pla ...

javascriptjsonnode.jsexpressbusboy

Developing a Jquery solution for creating radio buttons layout

Looking to create a radio button functionality within different groups using multiple select. For Group A: If the user selects A1, then it should automatically deselect A2 and A3. If the user selects A2, then it should automatically deselect A1 and A3. I ...

javascriptjqueryhtmlmultiple-select

I am encountering an issue with this code. The objective is to determine the frequency at which a specific word appears in the provided paragraph

function processWords(){ text = document.getElementById("inputText").value; text = text.replace(/(^\s*)|(\s*$)/gi,""); text = text.replace(/[ ]{2,}/gi," "); text = text.replace(/\n /,"&bso ...

javascript

The file_get_contents() function encountered an issue as the content type was not specified, leading to it assuming

I am currently working on a project using PHP and JavaScript. I need to call an API from the camera using PHP code. I am using the file_get_contents function and Post request for this purpose. Below is the code snippet: $value = $_POST['TakeNewPic&ap ...

javascriptphpajaxrequest

Vanishing Act: React-js MUI Tooltip vanishes upon clicking

The standard behavior of the MUI Tooltip is as follows:
 If the button/icon to trigger a tooltip is not in focus, the tooltip will not disappear when clicking directly on the popper. However, if the button/icon is focused, the tooltip will disappear upo ...

javascriptreactjsmaterial-uitooltip

If you click outside of a Div element, the Div element will close

I am looking for a way to implement a function that will hide a specific div when I click outside of its area. The div is initially set to Position: none and can be made visible using the following function: Div Element: <div id="TopBarBoxInfo1" oncli ...

javascriptjquerycsshtml

Apply a style to the div element that contains a TextInput component

As a beginner in the world of React and Material UI, I am currently working with Material UI version "1.0.0-beta.17", React 15.6.2, styled-components 2.0.0, and styled-components-breakpoint 1.0.1. Within a div element, I have two TextInput fields. const ...

javascriptcssreactjsmaterial-uistyled-components

Various input tools available for every Textarea

I'm grappling with this particular case. Each textarea should have its own toolbox, but currently only one is active (I anticipate having more than 2 areas, so JavaScript needs to be able to recognize them by ID) I attempted to use something like: f ...

javascriptjquery