JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/openlayers/2.11/OpenLayers.js"></script>
<div id="map" style="width: 600px; height: 240px"></div>
<input type="checkbox" id="toggle" checked /> <label for="toggle">Toggle Display</label>

JavaScript

var map = new OpenLayers.Map("map", {
    projection: "EPSG:900913"
});
var osm = new OpenLayers.Layer.OSM();
map.addLayer(osm);

var layer = new OpenLayers.Layer.Vector("layer", {
    style: {
        pointRadius: 6,
        fillOpacity: 0.6,
        strokeWidth: 0
    }
});
var pointA = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(-8857187, 1001242));
var pointB = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(0, 0));
layer.addFeatures([pointA, pointB]);
map.addLayer(layer);

map.zoomToMaxExtent();

$("#toggle").change(function() {
    
    display = $(this).attr("checked") ? "" : "none";
    
    // Toggle point A and point B's visiblity
    pointA.style.display = display;
    pointB.style.display = display;
    
    // Only redraw A
    layer.drawFeature(pointA);
    
    // Redraw entire layer
    // layer.redraw();
    
});