how do i set the text that my json file is printing to screen i want to hide the text


Tags: jquery,css,json

Problem :

i have a json data file that stores values and prints it out to the screen but the problem is that the values is attached to a css property width. i dont want the output to be the actual data in the form of a number, i just want to connect the json file and have the value set the width of where the bar must be.

my jquery is:

        $(document).ready( function(){
        var MAX_WIDTH = 100; // Define max bar width in Pixels here
        $.getJSON( "js/json/sidekicks.json", function(obj){
            $.each(obj.Sidekicks, function(key, value){
                var color = 'rgb(' + ((value.Score / 100) * 255) + ', #de0001, 10';
                var width = (value.Score / 33) * MAX_WIDTH;
                $('div#' + value.Id).find('span.red_line_fill').text(value.Score).css("background-color", color).width(width);

            });

        });

    });

here is a picture to show what i mean. i want to remove the value 20 that prints out to the screen enter image description here

how would i get who ever is in the lead to display the image "1st"

enter image description here



Solution :

use text('')(or remove .text() to not set any value. But this will not hide already shown text) to set empty value.Try this:

  $('div#' + value.Id).find('span.red_line_fill').text('').css("background-color", color).width(width);

    CSS Howto..

    How to achieve this layout with div and css?

    CSS - how to make responsive images

    How to scale a .svg being the background in a div?

    How to make whole table cell clickable but vertical align text inside it - CSS

    How to use one popup box to display arbitrary number of information respectively?

    How to use global stylesheet with css loader

    How do I chain an infinite css animation to a one-time css animation?

    Hide/Show table in my Email with the use of a button

    Should be Simple: How to preserve data on a page of basic javascript/css/html when going to another page

    How to serve SVG using C# so that it will render as a CSS background image

    How to find address of css and js files?

    jQuery - jCarouselLite - Images are not showing up

    How to fix height respective screen resolution?

    How to populate JSON response values in Jquery

    how to add css classes to a component in react?

    Website Content Shown on Moz but not Chrome

    How to fix internet explorer 9 overflow with form elements displayed in a list and “display:table”-based layout

    How to change qunit theme / layout

    how to specify a different image in css depending if the user visits on a desktop or a mobile browser

    How to position a drop down list nav bar inside header in html css

    How do I repeat select elements in HTML

    How to center modal window in css+html?

    How to make equal space between boxes in one row via CSS

    css 3d animation, how?

    How can I create Javascript Buttons with Themes?

    How to DRY Sass code using variables?

    How can a transformed Image transition back to it's original shape when hovered?

    How do I get Internet Explorer to do a better job displaying images

    How to create a vertical linear gradient for a GTK separator

    How to make two divs side by side using inline-block?