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..

    CSS: how to properly style horizontal menu bar with background image and centered entries separated by icons

    How to add incremental values to a css attribute with Jquery

    How to prevent default Css scroll onclick and allow javascript event only?

    How to show hidden div in the same line as the paragraph text?

    How to Tie Events to CSS

    How to create an integrated row in the table?

    How to make hover dynamic in CSS?

    css top nav - left nav (menu), title in center, right side (more buttons) - howto?

    how to make a text ele to the right of a left floated ele automatically occupy the rest width?

    Does anyone know how Pinterest.com's layout works?

    Creating transparent text to show gradient color of underlying div

    How can I make this container and table responsive for mobile and ipad size?

    Text-only CSS slideshow

    How to float div up?

    How can I resize my iframe keeping the ratio?

    How to override default CSS in modern GWT applications?

    How do I make a table's columns fill the width not occupied by fixed-width columns?

    How to make a vector background image in css instead of using jpg or png

    How do I remove the blue border when I click on a hotspot mapped to my image in HTML/CSS?

    How to properly link CSS files with PHP footer and header

    How to prevent specific css style sheet from styling a specific html tag

    How to CSS two vertical cylinders

    How to apply css to div which has no class?

    How do you resize a container between two others?

    How to use the .css function with jQuery

    How to define the css :focus state in a jQuery selector?

    How to Manage Responsive Design in percentage(%)?

    How to assign CSS properties to aside tag

    How to set image height 90 % of whole page height (not viewport)

    How to detect when CSS value has changed?