You don't really make it clear whether you have a series of anchors to add different states, or...?
If you do, you can do something like this to record the appropriate state name for each link:
<a data-stateName="state_name">ADD STATE </a>
And then in JS, with jQuery:
$(document).ready(function() {
$("a[data-stateName]").click(function() {
openbox_state( $(this).attr("data-stateName") );
});
});
This removes the inline JavaScript from your html, and then uses jQuery to bind a click handler only to those <a>
elements that have a data-stateName
attribute. The handler then gets the value of that attribute to pass to the openbox_state()
function.
The document ready handler ensures that the anchor click binding doesn't happen until the document actually is ready, i.e., after the elements have been parsed and can be accessed from JS. (You don't need a ready handler if you put your JS in a script block at the end of the body element.)