Remove spaces from dynamically generated class name using jQuery

Question

I have a series of buttons and a series of divs. They have been given class names based on content from a drupal field collection, however the pieces of content are program titles with spaces in them ("Game Design", "Computer Programming", etc).

I want to have it so when a button is clicked, a div with the same class name as the clicked button is hidden. However, I think that the dynamically generated class names are causing problems because of the spacing between each word in the title and creating a whole bunch of classes, therefore the buttons do not function.

To give an idea of how the classes are made, heres a line from a field collection file where the divs are given their class names..

<div id="panel-wrap" class="<?=$content['field_curriculum_program_title'][0]['#title'] ?>">

And the buttons...

<?php for ($i = 0; $i < count($program_name); $i++) { ?>
  <button id="fullscreen-button" class="<?php print $program_name[$i];?>">
    <h4><?php print $program_name[$i]; ?></h4>
  </button>
<?php } ?>

So- is there a simple way to take multiple objects with the same id and apply jQuery to remove all spacing from their class names?

Answer 1

You should use str_replace in PHP for replacing spaces with underscores, much less headache.